jQuery 自动完成奇怪的行为

Question

我遇到了 jQuery 的自动完成问题。我想做的是根据输入显示建议列表。因此，例如，在 input class="font" 上，我想要一个字体大小列表，在 input class="color" 上，我想要一个颜色预测列表。

这是我的资料：

function suggestions(input, element) { 
  var suggestions = [];
  if (element.hasClass("color") !== -1) {  
    var i = 0;
    while (i < 100) {
      suggestions.push("color" + i.toString()); // for testing purpose
    i++;
    }
  } else {
      var nr = 1;
      while (nr < 1025) {
        suggestions.push(nr.toString() + "px");
        nr = nr + 1;
      }
  }

  $(element).autocomplete({
    minLength: 1,
    source: function (request, response) {
      var counter = 0;
      var filteredArray = $.map(suggestions, function (item) {
        if (item.startsWith(request.term) && counter < 10) {
          counter = counter + 1;
          return item;
        } else {
          return null;
        }
      });
      response(filteredArray);
    },
    autoFocus: true
  });
}

事实是，当我针对具有除 'color' 之外的任何 class 的输入进行测试时，它工作得很好。当它检测到 class 和 'color' 时，它会相应地构建建议数组，但会拒绝进入自动完成内的匿名函数 - source。这对我来说很奇怪，因为数组总是被构建并且自动完成应该总是被命中。

有什么想法吗？谢谢！

Answer 1

jQuery 的 .hasClass() returns 布尔值，所以你的代码应该是这样的：

if (element.hasClass("color")) { ... }

试试这个 JSFiddle（输入符号 "c"）

jQuery 自动完成奇怪的行为

jQuery autocomplete strange behavior

javascript

jquery

autocomplete