首页 > 解决方案 > 每次我想在自动完成搜索列表的末尾显示一个默认值,而不管搜索结果如何。任何人都可以帮助我吗?

问题描述

我的 test.php 文件中有 JSON 数据,这些数据显示在 jQuery AutoComplete 控件的搜索结果中。

每次我想在自动完成选项列表的末尾显示一个默认值(也存在于 JSON 数据中)时,无论搜索结果如何。任何人都可以帮助我吗?

$.getJSON("test.php", function(data) {
  var newData = [];

  $.each(data, function(i) {
    newData.push({
      value: data[i].Id,
      label: data[i].Name
    });
  });

  data2 = JSON.stringify(newData);

  $('#Major').autocomplete({
    minLength: 2,
    source: function(request, response) {
      var q = request.term;
      var myResponse = [];
      $.each(JSON.parse(data2), function(key, item) {
        if (item.label.toLowerCase().indexOf(q) === 0) {
          myResponse.push(item);
        }
      });
      response(myResponse);
    }
  });

标签: javascriptjqueryautocompletejquery-ui-autocomplete

解决方案


一旦 AJAX 调用完成,您可以只push()将默认项放在数组的末尾。另请注意,您可以通过使用map()andfilter()而不是显式循环来改进代码,而且您不需要对 JSON 进行字符串化然后重新解析,这只是多余的。尝试这个:

$.getJSON("test.php", function(data) {
  var newData = data.map(item => {
    value: item.Id,
    label: item.Name
  });

  // add your default here...
  newData.push({
    value: 'foo',
    label: 'bar'
  });

  $('#Major').autocomplete({
    minLength: 2,
    source: function(request, response) {
      var myResponse = newData.filter(item => item.label.toLowerCase().indexOf(request.term) === 0);
      response(myResponse);
    }
  });
});

推荐阅读