| 注册
请输入搜索内容

热门搜索

Java Linux MySQL PHP JavaScript Hibernate jQuery Nginx
xybw
9年前发布

jQuery 自动补全

$(function() {   // 自动补全   var maxcount = 0;// 表示他最大的值   var thisCount =0;// 初始化他框的位置   $("body").prepend("");   $("#sele").keyup(function(even) {    var v = even.which;    if (v == 38 || v == 40 || v == 13)// 当点击上下键或者确定键时阻止他传送数据     {     return;     }    var txt = $("#sele").val();//这里是取得他的输入框的值    if (txt != "") {     //拼装数据     $.ajax({      url : "Birthday_autoCompletion",//从后台取得json数据      type : "post",      dataType : "json",      data : {"bir.userName" : txt      },      success : function(ls) {       var offset = $("#sele").offset();       $("#autoTxt").show();       $("#autoTxt").css("top", (offset.top + 30) + "px");       $("#autoTxt").css("left", offset.left + "px");       var Candidate = "";        maxcount = 0;//再重新得值       $.each(ls, function(k, v) {        Candidate += "  " + v + "";        maxcount++;       });       $("#autoTxt").html(Candidate);       $("#autoTxt li:eq(0)").css("background", "#A8A5A5");       //高亮对象       $('body').highLight();       $('body').highLight($("#sele").val());       event.preventDefault();        //当单击某个LI时反映        $("#autoTxt li").click(function(){         $("#sele").val($("#autoTxt li:eq("+this.id+")").text());         $("#autoTxt").html("");         $("#autoTxt").hide();        });        //移动对象        $("#autoTxt li").hover(function(){         $("#autoTxt li").css("background", "#FFFFFF");         $("#autoTxt li:eq("+this.id+")").css("background", "#A8A5A5");         thisCount=this.id;},function(){          $("#autoTxt li").css("background", "#FFFFFF");});      },      error : function() {       $("#autoTxt").html("");       $("#autoTxt").hide();       maxcount = 0;      }     });    } else {     $("#autoTxt").hide();     maxcount = 0;     $("#sestart").click();    }   });   //当单击BODY时则隐藏搜索值   $("body").click(function(){    $("#autoTxt").html("");    $("#autoTxt").hide();    thisCount=0;   });   // 写移动事件//上键38 下键40 确定键 13   $("body").keyup(function(even) {    var v = even.which;     if (v == 38)// 按上键时     {      if(thisCount!=0){//等于零时则证明不能上了。所以获得焦点       $("#sele").blur();       if(thisCount>0)        --thisCount;       else        thisCount=0;      $("#autoTxt li").css("background", "#FFFFFF");      $("#autoTxt li:eq("+thisCount+")").css("background", "#A8A5A5");      }else{$("#sele").focus();}     } else if (v == 40) {// 按下键时      if(thisCount     {       $("#sele").blur();       ++thisCount;       $("#autoTxt li").css("background", "#FFFFFF");       $("#autoTxt li:eq("+thisCount+")").css("background", "#A8A5A5");      }     } else if (v == 13) {// 按确认键时      var tt=$("#"+thisCount).text();      if(tt!="")       {        $("#sele").val(tt);        $("#autoTxt").html("");        $("#autoTxt").hide();       }else       {        if($("#sele").val()!="")        $("#sestart").click();       }     } else {      if($("#autoTxt").html()!="")       {        $("#sele").focus();        thisCount=0;       }     }   });  });