Question

我正在使用jQueryUI自动完成功能，并且我有一个映射到select事件的函数，例如：

$("#someId").autocomplete({
    source: someData,
    select: function (event, ui) { ... },
    focus: function (event, ui) { ... }
});

我有一个特例：用户专注于自动完成下拉菜单中的项目（但未选中它），我需要从其他功能手动触发选择事件。这可能吗？如果是这样，怎么样？

Answer 1

这对我有用：

$(this).data('ui-autocomplete')._trigger('select', 'autocompleteselect', {item:{value:$(this).val()}});

Answer 2

你可以这样做：

$("#someId").trigger("autocompleteselect");

Answer 3

你可以像jQuery团队在单元测试中那样做 - 请参阅this回答

Answer 4

1行解决方案

$('.ui-menu-item .ui-corner-all:contains(\"123")').autocomplete({autoFocus:true}).mouseenter().click()

Answer 5

$('#someId').data('uiAutocomplete')._trigger('select');

Answer 6

如果我们想特别触发搜索：

$('#search-term').autocomplete('search', 'searching term');

或只是

$('#search-term').autocomplete('search');

$('#search-term').autocomplete({
    ...
    minLength: 0, // with this setting
    ...
});

Answer 7

只需调用以下功能

即可

setAutocomplete("#txt_User_Name","rohit");

function setAutocomplete(autocompleteId,valuetoset)
    {
        $(autocompleteId).val(valuetoset);
        $(autocompleteId).autocomplete("search", valuetoset);
        var list = $(autocompleteId).autocomplete("widget");
        $(list[0].children[0]).click();
    }

Answer 8

从外面看：

$($('#someId').data('autocomplete').menu.active).find('a').trigger('click');

如何在“打开”自动完成事件内按水平箭头键设置选择触发的示例：

$('#someId').autocomplete({
    open: function(event, ui) {
        $(this).keydown(function(e){
            /* horizontal keys */
            if (e.keyCode == 37 || e.keyCode == 39) {
               $($(this).data('autocomplete').menu.active).find('a').trigger('click');
            }
        });
    }
});

不幸的是，如何解决这个标记为“成功”的好方法在我的应用程序中没有用于铬140.0.835.200

Answer 9

您不必经过一堆繁琐的操作即可调用select。这就是我从自己的自动完成扩展版本中调用select的方式。

$(this).data('ui-autocomplete').options.select(event, ui);

我在哪里使用

/**
 * The jQuery UI plugin autocomplete
 */
$.widget( "ui.autocomplete", $.ui.autocomplete, {
   options: {
      close: function( event, ui ) {
         if (typeof event.currentTarget == 'undefined') {
            $(this).val("");
            $(this).data('ui-autocomplete').options.select(event, ui);
         }
      }
   }
 });

Answer 10

我找到了非常简单的方法来使它工作。上面的答案对我不起作用。

我的输入定义：

<div class="search_box">
<input type="text" class="inp disabled" id="search-user-id" placeholder="Search by user name or email" />
</div>

自动完成定义：

$('#search-user-id').autocomplete({
    minChars: 3,
    paramName: 'searchTerm',
    deferRequestBy: 200, // This is to avoid js error on fast typing
    serviceUrl: '${pageContext.request.contextPath}/settings/reset/psw/query',
    type: 'POST',
    onSelect : function(suggestion) {
        showUserData(suggestion.dto);
    }, 
    onSearchError: function (query, jqXHR, textStatus, errorThrown) {
        $('.cev-error-fields.reset-password').find('.error_msg').text(errorThrown).show().fadeOut(7000);
    }
});

触发它：我从其他页面定义的ajax触发，为简单起见，我不把这里的ajax放在这里。在ajax响应中我只是这样触发它：

        $('#search-user-id').val(username);
        $('#search-user-id').focus();

有效。

如何在jQueryUI中手动触发自动完成“select”事件？

10 个答案: