如何在Google风格中添加来自ajax call的实时搜索结果？
如何在Google风格中添加来自ajax call的实时搜索结果？
提问于 2016-02-02 21:37:15
我有一个Ajax live search函数，它可以成功地返回它需要返回的值。但我只需要像Google或Youtube那样列出结果，我不知道怎么做(这是我第一次使用实时搜索功能)。所以我需要像这样简单地返回这些值：
下面是我当前的索引页面代码：
<input type="text" value="" name="s" id="s" placeholder="Search">
<input type="submit" id="searchsubmit" value="Search" class="prefix button">
<ul id="searchresults" class="searchresults"></ul>下面是我的ajax函数：
$(document).ready(function() {
$('#s').typeWatch({
captureLength: 2,
callback: function(value) {
$.ajax({
type : "post",
dataType : "json",
url : myAjax.ajaxurl,
data : {action: "searchq", s : value},
success: function(response) {
if(response.type == "success") {
$.each(response.val,function(){
var li = $('<li/>').appendTo('#searchresults');
$('<a/>').text(this.post_title).attr('href',this.url).appendTo(li);
});
}
},
error: function(errorThrown) {
}
})
}
});//end typewatch event
});这将返回如下结果：
搜索结果确实会以列表的形式出现，但它与谷歌或youtube不同，在后者中，你可以用箭头键滚动搜索结果。
当我点击第二张图片中的输入表单时，我看到标准的下拉列表显示在它上面，这正是我想要的结果的显示方式(但这只显示我之前输入的内容)。
所以我的问题是，我如何在那里得到我的结果，或者创建它？
我希望这足够清楚地理解我正在尝试获得的东西。
(我选择不包含php函数，因为它是100%正常工作的)
回答 1
Stack Overflow用户
发布于 2016-12-30 08:34:45
您希望将文本输入的autocomplete属性设置为"off“，以禁止以前输入的文本出现在下拉列表中。例如：
<input type="text" autocomplete="off">在w3schools上提供了autocomplete属性的审查。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/35155031
复制相关文章
相似问题
腾讯云开发者
