Javascript 多个复选框选择延迟，以检查其他复选框更改

我被迫使用jQuery Mobile，尽管它是一个构造良好的系统，但我还是有些犹豫。因此，我有一个表单，当任何复选框更改时提交。客户端希望这样，当他们单击一个请求时，页面将等待提交一个设置的时间，这样，如果选择了另一个请求，则不会触发上一个请求，而新的请求会触发。它本质上是为了减少即时性，并允许更有效的过滤/请求。我的代码是这样的：

$（函数（）{
var sForm=“form[name='Waves']”，
scbox=“输入[type='checkbox']”，
sWaves=“”；
变量$Cboxes=$（sForm+“”+SCbox），
sChecked=SCBOX+“：选中”；
$Cboxes.change（函数（事件）{
var$this=$（this）；
如果（$this.attr（“id”）！=“ClearAll”）{
调试（$（this））；
调试（'更改页面'）；
sWaves=“”；
//使用“标准检查”为选定波浪形成字符串，如果它是最后一个波浪
//用于逗号生成的元素逻辑。
$。每个（$（sChecked），函数（i，v）{
var$this=$（this）；
var iIndex=v.值；
sWaves+=iIndex+（（i==$（sChecked）.length-1）？“”：“，”；
} );
调试（“要选择的波浪：”+sWaves）；
$.mobile.changePage（“default.asp”{
数据：{Wave:sWaves}，//提交以前形成的字符串
类型：“职位”
} );
//$（sForm.submit（）；
}否则{
$（sChecked）.add（$（this））.attr（“选中”，false）.checkboxradio（“刷新”）；
$.mobile.changePage（“default.asp”{
数据：{Wave:}，
类型：“职位”
} );
}
} );
$（“#ClearAll”）。单击（函数（事件）{
event.preventDefault（）；
} );
$（“.slideout”）。单击（函数（）{
$（this）.parents（“.ui可折叠”）.find（“.ui图标减号”）.click（）；
} );
} );

表单的HTML：

触发更改事件时，要执行的操作计划在2000毫秒后执行，
如果用户在此之前改变主意，只需清除间隔并创建一个新的间隔，延迟很容易实现

$(function() {
    var $form = $("form[name='Waves']"),
        $Cboxes = $("input[type='checkbox']", $form),
        timer = null
        delay = 1000;

    $cboxes.not("#ClearAll").change(function() {

        // reset the current timer
        window.clearTimeout(timer);

        // create a new timer to delay form submission
        timer = window.setTimeout(function() {
            // get all the selected checkboxes as an array
            // and create a comma separated string
            var sWaves = $cboxes.is(":checked").map(function(item){
                return item.value;
            }).join(",");
            $.mobile.changePage("default.asp", {
                // Submit the previously formed string
                data: { Wave: sWaves },
                type: "post"
            });

        }, delay);
    });


    $("#ClearAll").change(function() {
        $cboxes.attr("checked", false).checkboxradio("refresh");

        $.mobile.changePage("default.asp", {
            data: { Wave: "" },
            type: "post"
        } );
    })
});

我还冒昧地简化了你的一些逻辑。尤其是在面对
Array.join（）
太多的爱时，字符串的创建似乎太复杂了。我讨厌计时器>：(
$(function() {
    var $form = $("form[name='Waves']"),
        $Cboxes = $("input[type='checkbox']", $form),
        timer = null
        delay = 1000;

    $cboxes.not("#ClearAll").change(function() {

        // reset the current timer
        window.clearTimeout(timer);

        // create a new timer to delay form submission
        timer = window.setTimeout(function() {
            // get all the selected checkboxes as an array
            // and create a comma separated string
            var sWaves = $cboxes.is(":checked").map(function(item){
                return item.value;
            }).join(",");
            $.mobile.changePage("default.asp", {
                // Submit the previously formed string
                data: { Wave: sWaves },
                type: "post"
            });

        }, delay);
    });


    $("#ClearAll").change(function() {
        $cboxes.attr("checked", false).checkboxradio("refresh");

        $.mobile.changePage("default.asp", {
            data: { Wave: "" },
            type: "post"
        } );
    })
});