【文件属性】：
文件名称：防google自动补齐
文件大小：4KB
文件格式：JS
更新时间：2014-04-09 15:30:40
自动补齐
防google自动补齐，异步调用数据
$(document).ready(function(){
//表示当前高亮的节点
highlightindex = -1;
var timeoutId;
var wordInput = $("#word");
var wordInputOffset = wordInput.offset();
$("#auto").hide().css("border","1px black solid").css("position","absolute").css("background-color","white")
.css("top",wordInputOffset.top+wordInput.height() + 13 +"px")
.css("left",wordInputOffset.left).width(wordInput.width() + 5);
//控件1自动补全
wordInput.keyup(function(event){
//处理文本框的键盘事件
var myEvent = event||window.event;
var keyCode = myEvent.keyCode;
//对输入字符的判断
if((keyCode >= 65 && keyCode<=90) || (keyCode >= 48 && keyCode <= 57)||(keyCode>=96 && keyCode<=105) || keyCode ==46 || keyCode == 8 || keyCode == 32){
var wordText = $("#word").val();
var autoNode = $("#auto");
if(wordText!=""){
//把文本框的字符传到服务器端
//清除上次未完成的延时
clearTimeout(timeoutId);
timeoutId = setTimeout(function(){
$.post("/wght/wght/bargain/searchIndex.do?word="+wordText,function(data){
//将dom对象data转换为jquery数据
var jqueryObj = $(data);
//找到所有word节点
var wordNodes = jqueryObj.find("word");
autoNode.html("");
//遍历word，将起放入对话框中
wordNodes.each(function(i){
//取单词内容，
var wordNode = $(this).text();
//新建div节点，将单词内容放到节点里，将节点放置页面
if(wordNode != null){
$("
").css("font-size","13px").css("height","18px").css("padding-top","1px").html(wordNode).appendTo(autoNode);
}
var completesVal=$("#auto").children("div");
var newDivNode =$("
").attr("id",i);
//新增鼠标进入事件，高亮显示
completesVal.mouseover(function(){
if(highlightindex != -1){
$("#auto").children("div").eq(highlightindex).css("background-color","white");
}
highlightindex = $(this).attr("id");
$(this).css("background-color","yellow");
});
//新增鼠标移出事件，取消高亮
completesVal.mouseout(function(){
$(this).css("background-color","white");
});
//鼠标单击事件，补全其内容
completesVal.click(function(){
var comText = $(this).text();
$("#auto").hide();
highlightindex=-1;
$("#word").val(comText);
});
});
//如果有数据，显示之
if(wordNodes.length > 0){
autoNode.show();
}else {
autoNode.hide();
highlightindex=-1;
}
},"xml");
},500);
}else{
autoNode.hide();
highlightindex=-1;
}
}else if(keyCode == 38 || keyCode==40){
//如果输入的是向上38向下40按键
if(keyCode == 38){
//up
var autoNodes = $("#auto").children("div");
if(highlightindex !=-1)
{
autoNodes.eq(highlightindex).css("background-color","white");
highlightindex--;
}else{
highlightindex = autoNodes.length -1;
}
if(highlightindex == -1){
//如果修改索引值以后index变成-1，则将索引中指向最后一个元素
highlightindex = autoNodes.length -1;
}
//让现在被高亮的内容变成黄色
autoNodes.eq(highlightindex).css("background-color","yellow");
}if(keyCode == 40){
//down
var autoNodes =$("#auto").children("div");
if(highlightindex !=-1)
{
autoNodes.eq(highlightindex).css("background-color","white");
}
highlightindex++;
if(highlightindex == -1){
//如果修改索引值以后index变成-1，则将索引中指向最后一个元素
highlightindex = 0;
}
//让现在被高亮的内容变成黄色
autoNodes.eq(highlightindex).css("background-color","yellow");
}
}else if(keyCode == 13){
if(highlightindex !=-1)
{
var comText =$("#auto").hide().children("div").eq(highlightindex).text();
highlightindex=-1;
$("#word").val(comText);//将文本框内容改成选中项
//$("form:first").submit(); //提交form。若没有这句话，按下回车后，仅仅只改变了文本框里的内容，但是由于form本身就监控了回车按键默认为submit，提交的是文本框改变之前的内容，解决这个问题最简单的方式就是在文本框内容改变以后强制提交form的内容，此时，提交的内容就是选中项。
}else{
$("#auto").hide();
//让文本框失去焦点
$("#word").get(0).blur();
}
}
});
})
