3

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。つまり、3つ以上ではなく、4つ以上をチェックしています。

正確に3つのボックスをチェックしたい場合は、行う必要がありますn === 3。3回以上使用したい場合と3回n >= 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);​

ランダムな側面として、:checkboxは実際に減価償却されます。[type="checkbox"]とにかくそれらをより速くするためにネイティブjavascriptを使用するので使用してください。

jsFiddleデモ

于 2012-08-30T22:34:28.577 に答える