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 是超时。

应用上述内容意味着回调函数会在 1 秒超时后被调用，如果以任何更短的间隔调用，则该调用将被忽略。