Question

$('#email').keyup(function(){
    setTimeout(function(){   
        $.post('advert/crop.php', {
            email:form.email.value, password:form.password.value            
        },
        function(output){
            $("#output").empty().append("<img src='loading.gif'/>");
            setTimeout(function() {$('#output').html(output).fadeIn(50)}, 500);
        }); 
    }, 2000);
});

我有一个输入类型的文本，我使用jquery帖子并从php发回来检查已注册的电子邮件或pw太短。

之后我使用keyup setTimeout 2秒，因此在用户输入时，它会自动检查。

我的问题是如果用户键入3个单词。它将发布3次。有什么方法可以解决这个问题吗？

在用户完成输入后每隔几秒设置一个计时器

Answer 1

每当有keyup event时清除计时器，以便只发送一个最新的请求。

var timer;
$('#email').keyup(function(){
    clearTimeout(timer);
    timer = setTimeout(function(){   
        $.post('advert/crop.php', {
            email:form.email.value, password:form.password.value            
        },
        function(output){
            $("#output").empty().append("<img src='loading.gif'/>");
            setTimeout(function() {$('#output').html(output).fadeIn(50)}, 500);
        }); 
    }, 2000);
});

Answer 2

(function () { //to avoid any variable set on global scope, use a closure
    var timeout;
    $('#email').keyup(function () {
        clearTimeout(timeout); //clear your timeout here
        timeout = setTimeout(function () {
            $.post('advert/crop.php', {
                email: form.email.value,
                password: form.password.value
            },

            function (output) {
                $("#output").empty().append("<img src='loading.gif'/>");
                setTimeout(function () {
                    $('#output').html(output).fadeIn(50)
                }, 500);
            });
        }, 2000);
    });
})();

Answer 3

你需要的是一个键盘延迟=）基本上它的计时器每按一次重置一次，只有在计时器达到极限时才运行。

请参阅此stackoverflow答案：How to delay the .keyup() handler until the user stops typing?

Jquery keyup＆amp;发布数据

3 个答案: