Question

我有一个输入框，我正在进行AJAX GET以检查电子邮件是否在我的数据库中。我只是检查一个电子邮件地址，如果它在数据库中，我们检索true / else false。因此，根据回报，我会显示勾选或交叉图像。

$.ajax({
    url: '/api/user/emailaddress/' + emailAddress,
    type: 'GET',
    dataType: 'json',
    success: function(data) {
        if (data===true) {
            $(".email-address-validator").removeClass("success");
            $(".email-address-validator").addClass("error");
            }
        }
});

每次在输入框字段中按下某个键时，都会调用它。我认为可能支持的问题是，如果有人查看此文件并且看到我在该字段上执行AJAX GET请求，他们可能只是按住该特定输入框上的键。

问：如何在此设置超时，大约5秒钟，这样用户不会只是在垃圾箱中发送垃圾邮件？

Answer 1

您可以设置一个标志来处理这种情况。这样的事情比计时器要好得多。

var waitingForResponse= false;
function isValidEmail () {
    if (!waitingForResponse) {
        waitingForResponse = true;
        $.ajax({
            url: '/api/user/emailaddress/' + emailAddress,
            type: 'GET',
            dataType: 'json',
            success: function(data) {
                waitingForResponse= false;
                if (data===true) {
                    $(".email-address-validator").removeClass("success");
                    $(".email-address-validator").addClass("error");
                }
            }
        });
    }
}

此设计模式将阻止后续请求，直到收到第一个响应。如果您需要的请求之间的间隔比此建议多，那么您可以将waitingForResponse标志包装在成功回调内的setTimeout函数中。像这样：

var waitingForResponse= false;
function isValidEmail () {
    if (!waitingForResponse) {
        waitingForResponse = true;
        $.ajax({
            url: '/api/user/emailaddress/' + emailAddress,
            type: 'GET',
            dataType: 'json',
            success: function(data) {
                setTimeout(function () {
                    waitingForResponse= false;
                }, 5000);
                if (data===true) {
                    $(".email-address-validator").removeClass("success");
                    $(".email-address-validator").addClass("error");
                }
            }
        });
    }
}

如何在按键上延迟ajax调用？

1 个答案: