0

我正在使用 Jörn Zaefferer 的jQuery Autocomplete 插件。与数据一起工作得很好。当 OnChange 函数(击键)没有返回结果时,我试图通过显示“无结果”错误消息来自定义功能。我希望消息显示在与结果显示相同的 div 中。因此,当您在输入中输入字母时,div 将保持可见,但结果将替换为一条消息。样式没有什么花哨的,只是纯文本。

我可以让消息出现,但它会因为保留它而不返回显示结果而破坏功能(如果你删除了一些字母)。

功能示例是 qantas 目的地自动完成 www.qantas.com.au/travel/airlines/home/au/en


更新

在插件中我添加了功能

function NoResults() {

        var wasVisible = select.visible();
        clearTimeout(timeout);
        stopLoading();
        var resultText = $('.ac_results').html();
        var errorMessage = "There are no results that match your request. Please try again.";
        //alert(resultText);
        if (resultText.indexOf(errorMessage) == -1) {
            $('.ac_results').append(errorMessage);
        }

};

然后在请求功能中我将其更改为

function request(term, success, failure) {

        if (!options.matchCase)
            term = term.toLowerCase();
        var data = cache.load(term); if (data && data.length) { success(term, data); }
        else if ((typeof options.url == "string") && (options.url.length > 0)) {
            var extraParams = { timestamp: +new Date() }; $.each(options.extraParams, function(key, param) { extraParams[key] = typeof param == "function" ? param() : param; });
            $.ajax({ mode: "abort", port: "autocomplete" + input.name, dataType: options.dataType, url: options.url, data: $.extend({ q: lastWord(term), limit: options.max }, extraParams),
                success: function(data) { var parsed = options.parse && options.parse(data) || parse(data); cache.add(term, parsed); success(term, parsed); }
            });
        }
        else {
            select.emptyList();
            // failure(term);
            NoResults();
        }
};

我现在剩下的唯一问题是,一旦显示错误消息并且您更改输入以使其再次返回结果,错误消息仍位于结果列表的底部。

4

1 回答 1

0

我为您的问题找到了解决方案。使用“解析”选项,你不会在它的文档中找到这个选项,我检查了它的源代码找到了这个选项(检查行#373)。

你可以像这样使用这个插件:

$("#suggest4").autocomplete('http://jquery.bassistance.de/autocomplete/demo/search.php', {
  width: 300,
  multiple: true,
  matchContains: true,
  formatItem: formatItem,
  formatResult: formatResult,
  parse: function(data){
    var parsed = [];
    var rows = data.split("\n");
    for (var i=0; i < rows.length; i++) {
      var row = $.trim(rows[i]);
      if (row) {
        row = row.split("|");
        parsed[parsed.length] = {
          data: row,
          value: row[0],
          result: formatResult(row, row[0]) || row[0]
        };
      }
    }

    if (parsed.length == 0) {
      row = ['no results', null];
      parsed[parsed.length] = {
        data: row,
        value: row[0],
        result: formatResult(row, row[0]) || row[0]
      };
    }
    return parsed;
  }
});

但我认为最好的解决方案是修改Autocomplete插件并添加一个类似“noResults”的事件。您可以建议作者添加此事件:-)

于 2009-11-09T06:43:40.690 回答