Ajax 调用成功函数触发两次答案

【问题标题】：Ajax Call Success Function Firing TwiceAjax 调用成功函数触发两次
【发布时间】：2020-06-17 21:13:37
【问题描述】：

我有一个在输入的 onkeyup 事件后触发的 ajax 调用。一旦输入了 8 个号码，它就会拨打电话。

如果调用成功，它会向表中添加一个新行。

问题在于它添加了 2 行。如果也被触发两次，则 ajax 调用。如果我有调试器正在运行，它只会添加 1 行。如果在添加行时有警报，则仅添加 1 行。如果我没有调试器或警报，它会添加 2 。不知道为什么。

输入：

<input style="width:100px" type="text" id="account0" maxlength="8" onkeyup="getAccount(this);" />

函数 addrow 被触发了两次（除非我正在调试或放入弹出窗口）。 addrow 函数不包含循环，只是在 HTML 表中添加一行。两次调用的变量 i 保持不变，不会递增：

function getAccount(val) {
        var account = val.value;
        if (account.length == 8) {
            var i = parseInt(val.id.replace("account", ""));
            $.ajax({
                type: "GET",
                url: "/123/AccountSelect?account=" + account,
                dataType: 'json',
                ContentType: "application/json, charset=UTF-8",
                success: function (data) {
                        //create new row for next account if needed
                        addRow(i + 1, data);
                },
                error: function (xhr, status, error) {
                    showModal(xhr.status + ": " + xhr.statusText);
                }
            });
        }
    }

同样，只有在没有调试器运行（当然）或没有弹出窗口来中断流程时，它才会这样做。

【问题讨论】：

标签： javascript html jquery ajax

【解决方案1】：

请尝试使用async: false，如下：

function getAccount(val) {
    var account = val.value;
    if (account.length == 8) {
        var i = parseInt(val.id.replace("account", ""));
        $.ajax({
            type: "GET",
            url: "/123/AccountSelect?account=" + account,
            async: false,
            dataType: 'json',
            ContentType: "application/json, charset=UTF-8",
            success: function (data) {
                    //create new row for next account if needed
                    addRow(i + 1, data);
            },
            error: function (xhr, status, error) {
                showModal(xhr.status + ": " + xhr.statusText);
            }
        });
    }
}

【讨论】：

我有，不幸的是它没有解决问题。在生产代码中使用 async: false 也不是我喜欢做的事情。
好奇怪……让我再试一次
或者我认为您可以使用任何布尔变量，例如 row_added。一开始它会是假的，你会在添加行时改变那个值。
我认为这是目前解决您问题的最快解决方案。
理论上是的，布尔值应该可以工作，但我也尝试过，但没有。

【解决方案2】：

这是有效的。我使用布尔值只允许添加一次该行，然后使用新行中新创建的输入的 onmouseup 事件来重置布尔值以允许添加其他行。

【讨论】：