javascript - 防止回调执行直到输入停止

标签 javascript timer dom-events

如果没有按下任何键,则触发 AJAX 调用的计时器。如果按下某个键,则中止最后一个计时器并添加一个新计时器。这就是我想做的,但未能成功。这是我的代码:

 var t;
 input.onkeyup = function(){
    $('.confirmText').html('Checking...');
    var timeStampObj = new Date()
    var timeStamp = timeStampObj.getTime();
    var oldTimeStamp = $(this).attr('timeStamp');//I store a timeStamp in the element
    if(timeStamp < 500 + oldTimeStamp){
        $(this).attr('timeStamp', timeStamp);
        clearTimeout(t);
    }
    t = setTimeout(function(){
        $.ajax({
            url: 'serverScripts/settings/checkEmailAvailability.php',
            data: 'email='+email,
            success: function(text){

           if(text == 'available'){
                $('.confirmText').html('Available!');
           }else{
                $('.confirmText').html('Occupied!');
               }
            }
        });
    }, 500);//Half a second
    $(this).attr('timeStamp', timeStamp);
}

最佳答案

这听起来像是您要一个去抖动器。术语comes from electronics .这是一种防止在某个时间阈值内触发多个事件的方法。您可以使用以下函数创建一个新函数,该函数仅在自上次事件后经过指定时间后才会被调用。

function debounce(callback, timeout, _this) {
    var timer;
    return function(e) {
        var _that = this;
        if (timer)
            clearTimeout(timer);
        timer = setTimeout(function() { 
            callback.call(_this || _that, e);
        }, timeout);
    }
}

// requires jQuery
$("div").click(debounce(function() {
    console.log("tset");
}, 2000));

只要点击事件持续触发,debounce 的回调就不会执行。

优秀Underscore.js图书馆包括an equivalent function并且至少有几个 jQuery 插件:

关于javascript - 防止回调执行直到输入停止,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5041548/

相关文章:

javascript - 对象值在 vue.js 的数组中返回 'Undefined'

c++ - 在特定功能上测量新/旧代码 CPU 使用率

javascript - JS 和 Prototype : mouseover influencing overlying element, 为什么?

c# - 表单时未处理计时器

Python 的 sleep() CPU 使用率

javascript - 动态加载.js文件时捕获onload事件?

javascript - ng-mouseover 事件传递 'this'(自身)对 DOM 的引用不起作用。除了使用核心 javascript 事件之外,还有其他方法吗?

javascript - 如何更新正文内容而不是添加到现有内容?

javascript - 创建一个扩展另一个对象的对象

javascript - If/else if/else 错误 - 意外的标识符