如何在jQueryUI中手動觸發自動完成「選擇」事件？

我使用jQueryUI的自動完成，我必須映射到select事件的功能，如：如何在jQueryUI中手動觸發自動完成「選擇」事件？

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

我有一個特殊情況：用戶集中在自動完成下拉列表中的項目（但沒有選擇它），我需要從不同的功能手動觸發選擇事件。這可能嗎？如果是這樣，怎麼樣？

來源

2011-10-03 Jon Lemmon

下面是我工作：

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

來源

2013-06-20 17:32:20 temuri

不錯，有沒有更好的解決方案？ – tinybyte

非常好！這是實際觸發事件的唯一解決方案，而不僅僅是模仿用戶與UI的交互。 – yossi

這比選定的答案要好，因爲它傳遞了重要的「ui」數據 – SemanticZen

你可以這樣做：

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

來源

2011-10-03 10:31:44

這並不在我的應用程序在鉻工作140.0.835.200 – palmic

這是因爲，如果事件與'$（束縛，這隻會工作）。在（ 'autocompleteselect'）'而不是在用'$（）構造時綁定。自動完成（{select：function（）{}}）'。使用'$（）。data（'autocomplete'）._ trigger（）'then – HenningCash

你能解釋一下如何在select中選擇一個選項嗎？ – tinybyte

從外面：

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

來源

2011-12-07 14:55:35 palmic

你可以做到這一點jQuery開發團隊確實在他們的單元測試的方式 - 看this答案

來源

2013-03-21 01:33:21

1線解決方案

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

來源

2013-11-27 14:59:48 cegprakash

使用'.mouseenter（） .click（）'幫助我正確地從結果中選擇一個項目 – Luksurious

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

來源

2014-05-09 06:31:55 kayz1

真的被這個困住了，非常感謝，我用它觸發了這個變化，就像這個$（'＃someId'）。data（'uiAutocomplete'）。 _trigger（ '變更'）; – NinaNa

這對我有用。 –

如果我們想要觸發特定搜索：

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

或只是

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

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

來源

2016-03-14 04:35:07 Alliswell

從我的角度來看，更清晰和更好的答案 – Camille

我覺得很簡單的方法，使其工作。上面的答案不適合我。

我輸入定義：

<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();

它的工作。

來源

2016-12-10 17:34:36 lauer

直接讓下面的函數

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

來源

2017-06-27 12:14:47

我不得不添加一個超時，因爲我的搜索沒有及時完成（是ajax調用） –

如何在jQueryUI中手動觸發自動完成「選擇」事件？

回答

相關問題