jQuery 如何在 jQueryUI 中手动触发自动完成“选择”事件？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7633727/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do you trigger autocomplete "select" event manually in jQueryUI?
提问by Jon Lemmon
I'm using jQueryUI autocomplete, and I have a function mapped to the select event, e.g.:
我正在使用 jQueryUI 自动完成功能，并且我有一个映射到 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?
我有一个特殊情况：用户关注自动完成下拉列表中的一个项目（但没有选择它），我需要从不同的函数手动触发选择事件。这可能吗？如果是这样，如何？
回答by temuri
Here's what worked for me:
以下是对我有用的内容：
$(this).data('ui-autocomplete')._trigger('select', 'autocompleteselect', {item:{value:$(this).val()}});
回答by Nicola Peluchetti
You could do:
你可以这样做：
$("#someId").trigger("autocompleteselect");
回答by Rune Vejen Petersen
回答by Rohit More
Simply call following function
只需调用以下函数
setAutocomplete("#txt_User_Name","rohit");
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();
}
回答by cegprakash
1 line solution
1 线解决方案
$('.ui-menu-item .ui-corner-all:contains(\"123")').autocomplete({autoFocus:true}).mouseenter().click()
回答by kayz1
$('#someId').data('uiAutocomplete')._trigger('select');
回答by Alliswell
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
...
});
回答by user7793758
You don't have to go through a bunch of rigmarole to call select. This is how I call select from my own extended version of autocomplete.
您不必通过一堆繁琐的操作来调用 select。这就是我从我自己的自动完成扩展版本中调用 select 的方式。
$(this).data('ui-autocomplete').options.select(event, ui);
where I use this
我在哪里使用这个
/**
* 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);
}
}
}
});
回答by palmic
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
不幸的是，如何解决这个标记为“成功”的好方法在我的铬 140.0.835.200 应用程序中不起作用
回答by lauer
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.
有效。
