我有一个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%正常工作的)
发布于 2016-12-30 00:34:45
您希望将文本输入的autocomplete属性设置为"off“,以禁止以前输入的文本出现在下拉列表中。例如:
<input type="text" autocomplete="off">
在w3schools上提供了autocomplete属性的审查。
https://stackoverflow.com/questions/35155031
复制