Question

我已经使用jQuery Autocomplete设置了自定义渲染解决方案。

// save a reference to the widget itself to override methods
var widget = $('#ui-search').on('autocompleteselect', function(e) {
    console.log('I am tracking the events from OUTSIDE');
}).autocomplete({
    /***** REMOVE THIS and 'autocompleteselect' does nothing *****/
    select: function(ui, item) {
        console.warn('I am tracking this from INSIDE');  
    },
    /***** *****/
    source: projects

}).data('ui-autocomplete');

// bind clicks on the autocomplete list to trigger the 'select' event
$('.ui-autocomplete').on('click', 'li', function(e) {
    var item = $(this).data('ui-autocomplete-item');
    // use the widget's internal trigger method for generating the right kinds of events
    widget._trigger('select', $.Event('autocompleteselect'), item);
})

// this is the custom rendering method and is only relevant in that it does not include an anchor tag
widget._renderItem = function( ul, item ) {
    return $( "<li>" ).data('ui-autocomplete-item', item).html(item.label + "<br>" + item.desc).appendTo( ul );
};

Live demo on JSFiddle

我想要实现的最终结果是单击列表项将选择该选项，而单击里面的按钮该元素将显示该选项的信息面板。（那部分已经完成而且不相关。）

除非我定义了自定义autocompleteselect处理程序，否则自动填充小部件不会响应select事件。如果我删除自定义select方法， widget什么都不做。我可以定义一个自定义处理程序来设置输入的值并关闭建议列表，但我无法弄清楚为什么默认处理程序不会触发。

是否有人成功触发autocomplete事件并让默认处理程序响应？有谁知道为什么这不会（或者可能不应该）以我期望的方式工作？

小提琴使用的是jQuery 1.9.1和UI 1.9.2;本地我使用的是jQuery 1.9.1和UI 1.10.3。环境之间的行为没有区别。

在jQueryUI自动完成中手动触发`autocompleteselect`

0 个答案: