JQuery 自动完成文本框行为问题

Question

我有一个自动完成输入，在页面加载时，当用户输入一个值时，会填充建议列表。然而，当用户仍然有那个输入焦点时，他们删除了文本，然后输入了其他内容，没有任何反应。 我的理论是，这与调用主要方法的位置有关 - 在文档加载时。我试图改变观察输入长度的功能，但仍然遇到同样的问题。无论如何，这是代码：

主要调用：

$(document)
.ready(function() {
    $('#autocompleteCR')
        .change(function() {
            if ($('#autocompleteCR').val().length > 0) {
                autoCompleteCheckRun();
            }
        });
});

函数体：

function autoCompleteCheckRun() {
$('#autocompleteCR')
    .autocomplete({
        minLength: 2,
        source: function (request, response) {
            $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: './PayInvoicesWS.asmx/GetCheckRun',
                data: "{'description':'" + document.getElementById('autocompleteCR').value + "'}",
                dataType: "json",
                success: function (data) {

                    var el = data.d;
                    response($.map(el,
                        function (el) {
                            return {
                                label: "CheckRunID:" + " " + el.CheckRunID + " " + el.Description,
                                value: el.CheckRunID
                            }
                        }));
                    calculateTotal();
                    doStep2();
                },
                error: function (result) {
                    alert("Error");
                }
            });
        },
        select: function (event, ui) {

            $("#CheckRunDescription").val(ui.item.label);
            $("#autocompleteCR").val(ui.item.value);
            $("#vendor_payment_type").prop("disabled", false);

        }


    });

};

观点

 <div class="divTableCell">
                    <div class="ui-widget">
                        <label for="autocompleteCR" id="checkRunLabel" style="font-size: 0.8em !important;">Check Run Lookup:</label>
                        <input type="text" id="autocompleteCR" />
                    </div>

                </div>

Answer 1

您不需要每次都在输入更改事件时应用自动完成。

检查您是否已完成“$('#autocompleteCR').val().length > 0”更改事件将由自动完成的 minLength 属性完成。

您只需要对准备好的文档应用自动完成功能。这可能会解决您的问题。

$(document).ready(function() {
    $('#autocompleteCR').autocomplete({
        minLength: 2,
        source: function (request, response) {
          $.ajax({
                type: "POST",
                contentType: "application/json; charset=utf-8",
                url: './PayInvoicesWS.asmx/GetCheckRun',
                data: "{'description':'" + document.getElementById('autocompleteCR').value + "'}",
                dataType: "json",
                success: function (data) {
                       var el = data.d;
                       response($.map(el,
                       function (el) {
                       return {
                          label: "CheckRunID:" + " " + el.CheckRunID + " " + el.Description,
                          value: el.CheckRunID
                       }
                     }));
                     calculateTotal();
                     doStep2();
                },
                error: function (result) {
                     alert("Error");
                }
          });
        },
        select: function (event, ui) {
            $("#CheckRunDescription").val(ui.item.label);
            $("#autocompleteCR").val(ui.item.value);
            $("#vendor_payment_type").prop("disabled", false);
        }
    });
});