jquery - jsonp - 获取百度提示内容
2016-09-21
Js
861
<!doctype html>
<html>
<head>
<meta charset=\"utf-8\">
<title>无标题文档</title>
<script src=\"/themes/default/static/js/jquery.min.js\"></script>
<scr
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script src="/themes/default/static/js/jquery.min.js"></script>
<script>
function FillUrls(keyword){
keyword = keyword || 'a';
var qsData = { 'wd': keyword, 'p': '3', 'cb': 'getData', 't': new Date().getMilliseconds().toString() };
$.ajax({
async: false,
url: "http://suggestion.baidu.com/su",
type: "GET",
dataType: 'jsonp',
jsonp: 'jsoncallback',
data: qsData,
timeout: 5000,
success: function (json) {
},
error: function (xhr) {
}
});
}
function getData(data) {
var Info = data['s']; //获取异步数据
console.log(Info);
}
var timeoutId; //延迟请求服务器
var highlightindex = -1; //高亮标记
$(function () {
$("#searchText").keyup(function (event) {
var myEvent = event || window.event;
var keyCode = myEvent.keyCode;
//console.log(keyCode);
var keyword = $(this).val();
//监控键盘
if (keyCode >= 65 && keyCode <= 90 || keyCode >= 48 && keyCode <= 57 || keyCode >= 96 && keyCode <= 111 || keyCode >= 186 && keyCode <= 222 || keyCode == 8 || keyCode == 46 || keyCode == 32 || keyCode == 13) {
//延时操作
clearTimeout(timeoutId);
timeoutId = setTimeout(function () {
timeoutId = FillUrls(keyword);
}, 500)
// FillUrls(keyword); //异步请求
if (highlightindex != -1) {
highlightindex = -1;
}
}
else if (keyCode == 38 || keyCode == 40) {
if (keyCode == 38) { //向上
var autoNodes = $("#auto").children("div")
if (highlightindex != -1) {
autoNodes.eq(highlightindex).css("background-color", "white");
highlightindex--;
} else {
highlightindex = autoNodes.length - 1;
}
if (highlightindex == -1) {
highlightindex = autoNodes.length - 1;
}
autoNodes.eq(highlightindex).css("background-color", "#ebebeb");
var comText = autoNodes.eq(highlightindex).text();
$("#searchText").val(comText);
}
if (keyCode == 40) { //向下
var autoNodes = $("#auto").children("div")
if (highlightindex != -1) {
autoNodes.eq(highlightindex).css("background-color", "white");
}
highlightindex++;
if (highlightindex == autoNodes.length) {
highlightindex = 0;
}
autoNodes.eq(highlightindex).css("background-color", "#ebebeb");
var comText = autoNodes.eq(highlightindex).text();
$("#searchText").val(comText);
}
} else if (keyCode == 13) { //回车
if (highlightindex != -1) {
var comText = $("#auto").hide().children("div").eq(highlightindex).text();
highlightindex = -1;
$("#searchText").val(comText);
} else {
$("#auto").hide();
$("#searchText").get(0).blur();
}
} else if (keyCode == 27) { //按下Esc 隐藏弹出层
if ($("#auto").is(":visible")) {
$("#auto").hide();
}
}
});
});
</script>
</head>
<body>
<input type="text" id="searchText" />
<div id="auto"></div>
</body>
</html>
很赞哦！ (0)
文章评论
-
-
-
0条评论