javascript:如何在短时间间隔内单击多个复选框时延迟提交数据？

Question

我有一组复杂的动态 html 形式的复选框。每当用户单击一个复选框时，就会生成一个相当昂贵的查询并将其提交到远程服务器。 我想根据用户的下一步操作延迟此提交操作。如果用户快速点击多个复选框，所有第一次点击都应该被丢弃，只有最后一次被处理并在 1 秒左右后最终提交。 也许这是一个常见问题，但我以前从未使用过超时。

Answer 1

您尝试使用的方法称为去抖动。
我的 javascript 中通常有一个通用的去抖功能:

var debounce=function(func, threshold, execAsap) {
    var timeout;
    return function debounced () {
        var obj = this, args = arguments;
        function delayed () {
            if (!execAsap)
                func.apply(obj, args);
            timeout = null; 
        };
        if (timeout)
            clearTimeout(timeout);
        else if (execAsap)
            func.apply(obj, args);
        timeout = setTimeout(delayed, threshold || 100); 
    }; 
};

然后当某些东西需要去抖动时，我通常会去抖函数，
在你的情况下，它可能是这样的:

$("checkbox").click(debounce(callBackFunction,1000));

其中 callbackFunction 是执行“昂贵的 jquery”的函数，1000 是超时。

应用上面的内容意味着 callbackFunction 在 1 秒超时时被调用，如果它以任何更短的间隔被调用，调用将被忽略。