Jquery自动完成无结果追加为下拉子问题
Jquery autocomplete no result append as dropdown child issue
我有一个用ASP.Net MVC3制作的网站(cpusort.com),用户可以在这里使用jquery ui自动完成搜索并从找到的结果中进行选择。
我使用这个脚本的结果
$(function () {
function log(message) {
}
$("#cpu").autocomplete({
source: "/Search/",
minLength: 1,
response: function (event, ui) {
if (ui.content.length === 0) {
alert("No Result Found");
//.append("<a href='/AdvancedSearch/[search_term]'>More results for [search_term]</a>")
}
},
open: function (event, ui) {
var url = "<a href='/AdvancedSearch/[search_term]'>More results for [search_term]</a>";
$("ul.ui-autocomplete.ui-menu").append(url);
},
select: function (event, ui) {
$("#cpu").val(ui.item.title);
$("#cpu-query").val(ui.item.query);
$("#cpu-clockspeed").val(ui.item.clockspeed);
$("#cpu-cores").val(ui.item.cores);
$("#cpu-image").val(ui.item.cpuimage);
return false;
}
})
.data("ui-autocomplete")._renderItem = function (ul, item) {
return $("<li>")
.append("<a href='/Cpu/" + item.query + "'><div style='width:100%'><span class='titlesearch' >" + item.title + "</span></div><div <div style='width:100%'><span class='titlesmallspan'>" + item.clockspeed + " GHz | " + item.cores + "</span></div></a>")
.appendTo(ul);
};
});
但是我如何显示如果没有找到结果,并且在这种情况下我使用alert,我如何用文本"附加单个子项;预先搜索";
.append("<a href='/AdvancedSearch/[search_term]'>More results for [search_term]</a>")
请帮助解决这个问题,谢谢
我建议您使用jQuery自动完成的open
事件
open: function (event, ui) {
search_term = event.target.value;
var d = $('.ui-autocomplete').append("<a href='/AdvancedSearch/[" + search_term + "]'>More results for [" + search_term + "]</a>")
}
这将在自动完成中列出的选项末尾附加所需的html元素。
JSFiddle#1
希望你能理解。
更新:
从您的评论来看,您似乎尝试了添加,这对自动完成的open
事件无效。
相反,您应该选择自动完成的response
事件。
为什么
1) 当找到匹配项时会触发open事件,而当找不到匹配项时该事件将不起作用。
2) 而response
事件在这两种情况下都会触发(这不能用于您的情况#1),但它只对您的情况#2有很大帮助。
response: function (event, ui) {
if (ui.content.length === 0) { //check for none results
search_term = event.target.value;
$(this).next('a').remove(); //Remove before you add
$(this).after("<a href='/AdvancedSearch/[" + search_term + "]'>More results for [" + search_term + "]</a>");
}
}
JSFiddle#2
这很有道理,我想是的。
修改代码以重新创建与您的问题相同的内容
相关文章:
- 第二次追加后添加逗号的问题等等
- 追加新web组件时出现线程问题
- 问题在于克隆、拼接、删除、追加 jquery 函数
- IE8 追加到 XML 问题:类型不匹配
- 在文件读取器中追加的订单问题
- JQuery 可拖动和可放置的追加问题
- Ajax追加问题
- 在动态加载的表中仅追加新数组项时出现问题
- 关于追加的问题
- 重复追加问题
- jQuery追加的问题
- 面对的问题,而追加下拉对象与字符串在Jquery
- 在向formData对象追加新值时遇到问题
- jQuery HTML追加导致UTF-8国家语言字符问题
- jQuery表追加问题
- 追加json_encode的问题
- $.each中追加的问题
- 使用$()追加元素的问题
- ajax请求成功后在jqtree中追加子节点的问题
- 我在jquery/javascript中的动态追加td有什么问题