3

我有一个页面，需要在检查三个复选框时淡出DIV。我正在使用下面的代码，但它不起作用。任何建议为什么？

<script>
function countChecked() {
var n = $("input:checked").length;
if($("input:checked").length > 3) {

    }
    else
    {
   $(".chkExample")
     .fadeTo(500, 0.2)
    }

}
countChecked();


$(":checkbox").click(countChecked);


</script>
4

2 回答 2

3

我稍微格式化了你的代码。这是检查> 3. 这与>= 4本例中的情况相同。因此，您要检查 4 个或更多，而不是 3 个或更多。

如果您想检查 3 个框，您需要这样做n === 3。如果您想要 3 次或更多使用n >= 3和 3 次或更少使用n <= 3

此外，如果您只想在点击事件上选中该框，则不需要手动调用countChecked

此外，根据评论，使用局部变量来保存 JQuery 对象的长度。

此外，根据 mcp 的回答、使用[type="checkbox"]和on方法。

结果：

function countChecked() {
    var n = $("input[type="checkbox"]:checked").length;
    if(n === 3) {
        $(".chkExample").fadeTo(500, 0.2)
    } else {
    }
}
$('input[type="checkbox"]').on('change', countChecked);​
于 2012-08-30T22:33:14.250 回答
1 
function countChecked() {
    var count = $('input[type="checkbox"]:checked').length;

    // this will test for 3 or more >=
    if (count >= 3) { alert('3 or more checked!'); }
    else { $(".chkExample").fadeTo(500, 0.2) }
}

countChecked();
// assuming you are using at least 1.7.2 of jQuery
// but start using `.on()` and with checkboxes/radios I always use 'change'
$('input[type="checkbox"]').on('change', countChecked);​

现在在随机方面：复选框实际上已折旧。使用[type="checkbox"]它会使用本机 javascript 来让它们更快。

​

jsFiddle 演示

于 2012-08-30T22:34:28.577 回答