//键盘按下 触发事件,异步访问数据库,拿到模糊查询的数据 <script > $("#shopId").on("keyup",function(e){ var key = window.event ? e.keyCode : e.which;//解决IE和其他浏览器的兼容问题,返回键盘按键 var val = $(this).val(); if(val != "" && key != 38 && key != 40){ $.ajax({ type: "POST", url: "${basePath}/commissionRank/shopIDSearch.do", data: { "shopId":val }, dataType: "json", success: function(data){ $(".resultList").show(); var name_list = data.list; var h=""; if(name_list!=null && name_list.length>0){ for(var i in name_list){ h+="<li>"+name_list[i].shopId+"</li>"; } } $(".resultList").empty().append(h); $(".resultList li").eq(0).addClass("hover"); } }); }else if(key == 38){ $(".resultList .hover").prev().addClass("hover"); $(".resultList .hover").next().removeClass("hover"); $("#shopId").val($(".resultList .hover").html()); } else if(key == 40){ $(".resultList .hover").next().addClass("hover"); $(".resultList .hover").prev().removeClass("hover"); $("#shopId").val($(".resultList .hover").html()); } else{ $(".resultList").empty().hide(); } }); $(document).on("mouseover",".resultList li",function(){ $(this).addClass("hover"); }); $(document).on("mouseleave",".resultList li",function(){ $(this).removeClass("hover"); }); $(document).on("click",".resultList li",function(){ $("#shopId").val($(this).html()); $(".resultList").empty().hide(); }) $("body").on("click",function(e){ if(e.target.className!="resultList" && e.target.nodeName!="LI"){ $(".resultList").empty().hide(); } });