javascript - EasyAutocomplete-每个keyup上的ajax更新选项对象

我有一个输入框，人们应该在其中输入城市名称，并且应该动态地自动完成此过程，方法是将输入的内容发送到API，将其在后端与当前可用的工作进行匹配，然后通过ajax结果数组，然后应在EasyAutocomplete插件中动态更新选项数据数组。

这是代码：

$(function () {
    var minlength = 3;
    $(document).on('keyup','#mainSearch2',function( ) {
        var that = this,
        inputVal2 = $("#mainSearch2").val();

        if (inputVal2.length >= minlength ) {
            if (searchRequest != null)
                searchRequest.abort();
            searchRequest =
            $.ajax({
                  type: "POST",
                  url: 'myurltotheapi',
                  data: {
                    apiKey: "myapikey", // required
                    city: inputVal2,
                    page: 0, // optional, which page of the results, starts at "0", defaults to "0"
                    perPage: 20 // optional, results per page, defaults to "20"
                  },
                  success: function (apiResponse2){
                      if (inputVal2==$(that).val()) {
                    //Receiving the result of search here
                        options = {data: []};
                        options.data = apiResponse2.locations.map(function (el) {
                          return el.city+", "+el.state;
                        });
                        $("#mainSearch2").easyAutocomplete(options);
                     }
                    }
        });
        }
    });
});

因此，当前发生的情况是，在第三个字符之后的每个按键上，输入下的自动完成列表都会刷新为正确的值，但是整个窗口在显示结果后一秒钟便消失了。输入框也失去了焦点，因此您必须手动单击以键入更多内容（但是您无法选择任何easyautocomplete结果，因为它们会很快消失，并且仅在下一个按键时显示）。在chrome开发工具中，“ .easy-autocomplete” div类看起来像被删除并再次添加。

我想知道是否有更好的方法来完成所有这些按键操作，EasyAutocomplete是否支持某种方式来动态发送每次按键的值并将内容从API结果中拉到options.data数组并应用它不会将注意力集中在输入框和令人失望的easyautocomplete结果窗口上。

谢谢！

最佳答案

答案是：

$(function() {
    $('#mainSearch2').easyAutocomplete({
    url: 'myurl',
    ajaxSettings: {
      dataType: "json",
      method: "POST",
      data: {
        apiKey: "myapikey"
      }
    },
    listLocation: "suggestions",
    preparePostData: function(data) {
        data.query = $('#mainSearch2').val();
      return data;
    },
    requestDelay: 400
  });
});

关于javascript - EasyAutocomplete-每个keyup上的ajax更新选项对象，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/41350676/