使用 Jquery Autocomplete 处理“无结果”答案

【问题标题】：handling "No results" with Jquery Autocomplete使用 Jquery Autocomplete 处理“无结果”
【发布时间】：2012-10-22 07:19:09
【问题描述】：

嘿，当用户当前查询没有结果时，我正在尝试返回一条消息！我已经查看了整个网络并且有类似的场景，但我似乎无法让它与下面的代码一起使用！谁能帮我解决这个问题，因为我正在拔头发试图修复它！

我需要保持使用键盘向下滚动结果的能力。

提前致谢。

HTML

Javascript 注意：远程数据源称为“dataLocCodes”，是一个javascript数组

// JavaScript 文档 $（函数（）{ $("#suggestSearchBox").focus().autocomplete(dataLocCodes, { 最大：15，选择第一：真，匹配包含：真，格式项目：函数（行，我，最大值）{ 如果（row.hotelId）{ 返回 row.accomName + ' - ' + row.city + ' - ' + row.country; } 别的 { 返回 row.city + ' - ' + row.country; } } }）。结果（功能（事件，行，格式化）{ $("input#suggestSearchBox").val(row.city + ' - ' + row.country); var 参数 = row.locparam; var encoded_url = param.replace(/ /gi,"+"); 编码的url = 编码的url.replace(/&/gi,"amp"); window.location.href = "hotels.html?location=" + encoded_url; }); });

【问题讨论】：

标签： javascript jquery jquery-ui jquery-autocomplete jquery-ui-autocomplete

【解决方案1】：

有几种方法可以处理这个问题。您可以创建一个source 方法，以便如果过滤器的结果为空，则添加“无结果”作为值，或者您处理response 事件以显示一条消息，即在您的用户界面中没有返回结果.如果使用source 方法，则添加一个选择处理程序以防止 No Result 成为一个值。

var availableTags = ['Abc', 'Def', 'ghi'];
$('#noresults').autocomplete({
    source: function (request, response) {
        var responses = $.ui.autocomplete.filter(availableTags, request.term);
        if (responses.length == 0) responses.push('No Result');
        response(responses);

    },
    response: function (event, ui)
    {
        if (ui.content.length == 0) {
            console.log('No results');
        }
    },
    select: function (event, ui) {
        // don't let no result get selected
        return (ui.item.value != 'No Result');
    }
});

【讨论】：