js实现联想搜索

xiaoxiao2021-02-27  359

功能:根据关键字联想搜索出结果后,根据关键字的变化,实时出现结果,类似于百度搜索的功能

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); } } } ); } } } );

转载请注明原文地址: https://www.6miu.com/read-4292.html

最新回复(0)