js實現聯想搜尋
阿新 • • 發佈:2019-02-15
功能:根據關鍵字聯想搜尋出結果後,根據關鍵字的變化,實時出現結果,類似於百度搜索的功能
1、delegate的用法,專門用在子元素上繫結的事件 delegate("p", "click", function() { }
2 、key up key down 事件 可以用
$(".input").on('input', function(e) {}
$("#searchres").delegate("p", "click", function() { $("#searchText").val($(this).text()); }); $("#searchText").keyup(function(e) { var key = e.keyCode; if ((key >= 48 & key <= 57) || key == 8) { var val = $.trim($(this).val()); if ("" == val) { alert("輸入內容不能為空") } else { $.ajax({ type : "POST", url : "GoodsServlet", data : { "type" : "key", "value" : val }, success : function(msg) { if ("無結果" == msg) { $("#searchres").html("<p>" + msg + "</p>"); } else { var obj = eval("(" + msg + ")"); var str = ""; for (var i = 0; i < obj.length; i++) { str = str + "<p>" + obj[i].gid + "</p>"; } $("#searchres").html(str); } } } ); } } } );