Question

在我的项目中使用jQuery Autocomplete，它运行良好。问题是，我想处理一个用户更改文本输入的情况。对于前数据包含（“prov 1”，“prov 2”），用户从菜单“prov 1”中选择，然后通过将1更改为2将其更改为“prov 2”。我在js中实现了“change”事件，但是ui.item是空的（我猜因为菜单没有显示..）我读到只有当文本框失去焦点时才会触发“更改”事件 - ＆gt;对我不好，因为流程正在选择“prov”并单击按钮继续。任何建议??

这是我的代码： JS

 $(element).autocomplete({
        minLength: 2,
        source: function (request, response) {
            $.ajax({
                url: requestUrl,
                dataType: "json",
                data: { query: request.term },
                success: function (data) {
                    response($.map(data, function (item) {
                        return {
                            label: item.Label,
                            value: item.Label,
                            realValue: item.Value
                        };
                    }));
                },
            });
        },
        select: function (event, ui) {
            var hiddenFieldName = $(this).attr('data-value-id');
            $('#' + hiddenFieldName).val(ui.item.realValue);
            hiddenFieldName = $(this).attr('data-value-name');
            $('#' + hiddenFieldName).val(ui.item.label);
        },
        change: function (event, ui) {
            alert('changed');
            if (!ui.item) {                    
                alert('no value'); /* IS FIRED */
            } else {

            }
        }
    });
});

Answer 1

尝试按键事件处理程序 - http://api.jquery.com/keypress/

Answer 2

尝试更改此内容：

change: function (event, ui) {

到此：

input: function (event, ui) {

或者你可以试试这个：

 $(element).autocomplete({
        minLength: 2,
        //all your code but not change: function
 }).on('input', function(e){
     alert('changed');
     if (this.value.length <== 0) {                    
        alert('no value'); /* IS FIRED */
     } else {
        alert(this.value);
     }
 });

在自动完成jQuery中更改事件

2 个答案: