Question

我正在使用自动完成类别。如果我直接在输入字段中键入，它将很好地工作。但是，如果我使用javascript为输入字段设置值，则不会触发自动完成功能。

//sample HTML
<input id="search">
<button id="button">Click</button>

//sample JS
$(document).on("keyup", '#search', function(event){
   $.ajax{
      ...
      autocomplete_data = ajax_provided_data;
      $("#search").catcomplete({
         source: function(request, response){
            console.log("source");
            response(autocomplete_data);
         },
         select: function(event, ui){
            //do stuff
         }
      });
   }
});

$(document).on("click", "#button", function(event){
   $("#search").val("abcd");
   $("#search").keyup();
});

当我单击#button时，输入的值被更改，keyup()被触发，并且ajax运行。但是，catcomplete()不会触发。从未在source函数中使用console.log。如果我手动在输入字段中键入内容，一切正常，它将在控制台中显示“源”。

我也尝试过this来触发空格键。还是没有运气。

它将起作用，但是，如果我单击按钮，然后在输入字段中手动键入空格。

如何解决此问题？

Answer 1

我看了jquery-ui.js自动完成部分。为了触发完整的自动完成功能，需要发生keydown或input事件。

通过修改this，将keyup更改为keydown，它会起作用。

function ShowAutoComplete($field, searchVal) {
   var e = $.Event('keydown');
   e.which = 32;
   $field.val(searchVal).focus().trigger(e);
}

Working jsfiddle

jQuery自动完成功能不会使用javascript设置的输入值触发

1 个答案: