如何在jQueryUI中手动触发自动完成“选择”事件?

I'm using jQueryUI autocomplete, and I have a function mapped to the select event, e.g.:

我使用jQueryUI autocomplete，我有一个映射到select事件的函数，例如:

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

I have a special case: The user has focused on an item in the autocomplete drop-down (but not selected it) and I need to trigger the select event manually from a different function. Is this possible? If so, how?

我有一个特殊的情况:用户关注自动完成下拉列表中的一个项(但没有选中它)，我需要从另一个函数手动触发select事件。这是可能的吗?如果是这样,如何?

9 个解决方案

#1

Here's what worked for me:

以下是对我有用的:

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

#2

You could do:

你能做的:

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

#3

You can do it the way the jQuery team does it in their unit tests - see this answer

您可以像jQuery团队在其单元测试中那样做——请参见这个答案

#4

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

#5

If we want to trigger search of something particularly:

如果我们想要触发搜索:

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

or just

或者只是

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

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

#6

Simply call following function

简单地调用下面的函数

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

setAutocomplete(“# txt_User_Name”、“罗希特”);

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

#7

From outside:

外:

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

An example how to setup select triggering at pressing of horizontal arrows keys from inside of "open" autocomplete event:

如何在“打开”自动完成事件中按水平箭头键时设置选择触发:

$('#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');
            }
        });
    }
});

Unfortunately that nice way how to solve this marked as "success" did not work at my app in chromium 140.0.835.200

不幸的是，在我的chromium 140.0.835.200的应用中，这种被标记为“成功”的解决方法并没有奏效

#8

1 line solution

1线解决方案

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

#9

I found very simple way to make it work. Answers above did not work for me.

我找到了一种很简单的方法。上面的答案对我不起作用。

My input definition:

我的输入定义:

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

The autocomplete definition:

自动完成的定义:

$('#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);
    }
});

Trigger it: I am triggering from an ajax defined in other page, I do not put the ajax here for simplicity. Inside the ajax response I just trigger it this way:

触发它:我是从另一个页面中定义的ajax触发的，我没有将ajax放在这里以简化。在ajax响应中，我这样触发:

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

It worked.

它工作。

#1