带有 AJAX 的 Jquery keyup 事件导致不正确的结果答案

【问题标题】：Jquery keyup Event with AJAX causing incorrect results带有 AJAX 的 Jquery keyup 事件导致不正确的结果
【发布时间】：2013-08-05 06:57:38
【问题描述】：

我有以下 Jquery 代码，它监听用户输入验证码并在每个按键上发送一个 ajax 请求以查看是否输入了正确的代码：

$('#joinCaptchaTextBox').keyup(function() {
    $.get('scripts/ajax/script.php', {
        'join_captcha': '1',
        'captcha': $('#joinCaptchaTextBox').val()},         
        function(data) {
            var obj = JSON.parse(data);
            if(obj.ajaxResponse.status) {
                $('#joinCaptchaNotAcceptable').hide();
                $('#joinCaptchaAcceptable').show();
            }else{
                $('#joinCaptchaAcceptable').hide();
                $('#joinCaptchaNotAcceptable').show();
            }
    });
});

另一端的 PHP 脚本只是检查会话并回复：

if($siteCaptcha == $_SESSION['secretword']) {
  $this->captchaCompare = TRUE;
}else{
  $this->captchaCompare = FALSE;
}

这在 95% 的情况下都可以正常工作，但我发现有时它会报告输入的验证码不正确，即使它是正确的。我认为这可能是因为当快速键入时，许多请求被发送到服务器并且返回的订单或请求不是发送的订单，因此（因为只有一个是正确的）最后收到前一个并且显示不正确。

有没有更好的方法来做到这一点？有没有办法确保最后收到的最后一个请求？有什么我在这里想念的吗。我可以提供更多信息。

谢谢

【问题讨论】：

这会有所帮助，因为它会引入等待/延迟github.com/dennyferra/TypeWatch
这是个坏主意；这意味着脚本只需要发送大约 25 个字符最多来暴力破解您的 CAPTCHA。换句话说，你会收到垃圾邮件。
还不错；我以为您正在检查文本到目前为止。但这仍然很糟糕。如果你弄错了，你见过的每一个验证码都会变成一个新的验证码是有原因的。计算机视觉能够缩小可能的字母范围，如果您允许多次猜测（确实如此），那么可以对剩余的可能性施加蛮力。

标签： php jquery ajax

【解决方案1】：

添加超时，以便在用户快速键入时不会在每次按键时都发送请求：

$('#joinCaptchaTextBox').on('keyup', function() {
    clearTimeout( $(this).data('timer')  );
    $(this).data('timer', 
        setTimeout(function() {
            var data = {
                    join_captcha: '1',
                    captcha : $('#joinCaptchaTextBox').val()
            };

            $.ajax({
                url : 'scripts/ajax/script.php',
                data: data,
                dataType: 'json'
            }).done(function(result) {
                $('#joinCaptchaNotAcceptable').toggle(!result.ajaxResponse.status);
                $('#joinCaptchaAcceptable').toggle(result.ajaxResponse.status);
            });
        },500)
    );
});

【讨论】：