Question

我正在使用http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/中的jQuery自动完成插件当用户从下拉列表中选择结果时，输入字段将被聚焦。如何阻止插件执行此操作？我使用这篇文章中的提示使其工作：jQuery autocomplete plugin not focusing the next clicked field 但这仅在用户使用鼠标选择结果时才有效。然后输入字段不会聚焦。但是当用户使用ENTER键或TAB键时，输入仍然是焦点。

任何人都知道如何更改这一点，以便当用户从下拉列表中选择一个值时，输入字段不会聚焦？

非常感谢你！

问候，金

Answer 1

通过插件的selectCurrent()函数中的这一行的外观：

$input.trigger("result", [selected.data, selected.value]);

...无论何时通过鼠标或键盘选择选项，都会在自动完成输入上触发“结果”事件。

你可以绑定到同一个事件并将焦点放在表单中的下一个控件上（我假设你想要的是什么，而不只是从当前的那个中删除焦点？）：

$("input").bind("result", function () {

   // Get all controls on the form
   var controls = $(this).closest("form").find("input, textarea, select, button");

   // Find the index of the next control
   var nextIndex = controls.index(this) + 1;

   // Check if this is already the last control, so wrap around to the first one
   if (nextIndex >= controls.length) nextIndex = 0;

   // Put focus on the "next" control
   controls.eq(nextIndex).focus();

});

Answer 2

你试过jQuery UI's autocomplete plugin吗？问题的一半已解决 - 当您按Tab键关闭自动完成时，输入字段将失去焦点。当按Enter键时，它仍然是聚焦的，但这可以很容易地修复：

$('#myInput').keyup(function() {
  // when Enter is pressed
  if (event.which === 13) {
    $(this).blur();
  }
});

修改

jQuery normalizes event对象，因此将其作为参数传递是不必要的。

Answer 3

$( "#to" ).autocomplete({
    source: availableTags,
    select: function (event, ui) {
        $( "#to" ).val( ui.item.label );
        $('#to').blur();
        return false ;
    }
});

从下拉列表中选择后，从聚焦输入字段开始停止jQuery自动完成

3 个答案:

修改