Javascript 如何限制用户仅从EasyAutoComplete（jquery）中列出的选项中进行选择？

我使用的是EasyAutoComplete，它虽然使用了jquery，但与标准的jQueryUI自动完成不同。我试图让用户只能从生成的列表中选择一个项目。我在这里找到了我想要的标准jquery ui自动完成的答案：

问题是，我不太确定如何将代码与EasyAutoComplete一起实现。具体地说，我想使用这个位：

    change: function (event, ui) {
        if (ui.item == null || ui.item == undefined) {
            $("#artist").val("");
            $("#artist").attr("disabled", false);
        } else {
            $("#artist").attr("disabled", true);
        }
    }

虽然EasyAutoComplete的文档提供了几个事件处理程序，但没有一个是针对我想要的事件的。我猜我需要在jquery.easy-autocomplete.min.js代码本身中加入这一点，但我不知道从哪里开始

---

最好的方法是什么？

我从他们的API中尝试了一些事件，认为最好的方法是捕获模糊上的textfield值，然后将其与可用数据进行比较

<script>
$(document).ready(() => {
  var options = {
  data: ["blue", "green", "pink", "red", "yellow"]
  }
    
$("#basics").easyAutocomplete(options);
$("#basics").blur(function() {
  let myval = $(this).val().trim().toLowerCase();
  let comparedata = options.data.map( (item) => {return item.toLowerCase()});
  if (comparedata.indexOf(myval) == -1) {
    $(this).val('');
  }
})
});
</script>

 <input id="basics" />

---

这需要一些研究，但实际上我能够想出一个解决方案。您可以在外部使用更改，而不是在“自动完成”选项中使用更改。此外，API还有一个getSelectedItemData函数，您可以使用它来提取项目数据

$("#artist").change(function () {
    let selectedvalue = $("#artist").getSelectedItemData();
    let specval = selectedvalue[0];
    
    if (specval == "undefined" || specval == null) {
        $("artist").val("");
    }
});

---

值得一提的是，虽然EasyAutoComplete确实有OnClick和onKeyCenter的事件，但没有一个好的、简单的捕获所有事件的方法。您必须单独编程这些事件，这不是干编码。此外，当用户在选择框外单击屏幕外时，他们没有相应的事件。

感谢您的帮助！实际上，我只是在选项之外使用了更改功能。我目前正在从事一个需要相同功能的项目。但是，当我尝试您的解决方案时，它会在选择项后清除字段中的选定值。有什么建议吗？我猜您选择的值要么返回null要么未定义。您是否尝试过使用console.log甚至警报来查看用户每次选择选项时的值？它可能没有返回您认为的值。星期二我需要在我的代码的另一部分中实现这个函数，所以如果到那时你仍然无法解决它，请将你的代码发布或发消息给我，我可以在那时查看一下。你在这方面是绝对正确的。返回的值不正确，因此我必须设置函数“onSelectItemEvent”，因为JSON提要只包含自定义标签。你的剧本写得很好。非常感谢你的帮助！