Jquery自动完成 - 无结果消息 [英] Jquery Autocomplete - no result message

查看:113
本文介绍了Jquery自动完成 - 无结果消息的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如果找不到结果,我希望自动完成功能在下拉列表中显示无结果列表。

I would like the autocomplete to display "no results" in it's drop down list if no result are found.

我的情况与JQuery默认示例类似。

My situation is like the JQuery default example.

$(function() {
    var availableTags = [
        "ActionScript",
        "AppleScript",
        "Asp",
        "BASIC",
        "C",
        "C++",
        "Clojure",
        "COBOL",
        "ColdFusion",
        "Erlang",
        "Fortran",
        "Groovy",
        "Haskell",
        "Java",
        "JavaScript",
        "Lisp",
        "Perl",
        "PHP",
        "Python",
        "Ruby",
        "Scala",
        "Scheme"
        ];
    $( "#tags" ).autocomplete({
        source: availableTags
    });
});

感谢您的帮助。

Thank you for your help.

推荐答案

Here's one way you could accomplish this:

$ b $ var
$(#tags)。autocomplete({
source:
$ b $函数(请求,响应){
var results = $ .ui.autocomplete.filter(availableTags,request.term);

if(!results.length){
results = [NoResultsLabel];
}

response(results);
},
select:function(event,ui){
if(ui。 item.label === NoResultsLabel){
event.preventDefault();
}
},
focus:function(event,ui){
if(ui .item.label === NoResultsLabel){
event.preventDefault();
}
}
});
});

$(function() { var availableTags = [ /* snip */]; var NoResultsLabel = "No Results"; $("#tags").autocomplete({ source: function(request, response) { var results = $.ui.autocomplete.filter(availableTags, request.term); if (!results.length) { results = [NoResultsLabel]; } response(results); }, select: function (event, ui) { if (ui.item.label === NoResultsLabel) { event.preventDefault(); } }, focus: function (event, ui) { if (ui.item.label === NoResultsLabel) { event.preventDefault(); } } }); });

基本上,您需要提供函数引用作为到自动完成。在该函数内部,您可以使用相同的实用程序函数( $。ui.autocomplete.filter )来过滤结果。然后你可以看到结果数组是否为空。如果是这样,您可以将默认消息添加到结果列表中。

Basically, you need to provide a function reference as the source to the autocomplete. Inside of that function, you can use the same utility function ($.ui.autocomplete.filter) to filter down the results. Then you can see if the results array is empty. If it is, you can add a default message to the results list.

我指定的另外两个选项可防止无结果选项从选择或集中。

The other two options I've specified prevent the No Results option from being selected or focused.

示例: http://jsfiddle.net/er6LF/

这篇关于Jquery自动完成 - 无结果消息的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆