2

可視性属性を使用してチェックボックスを表示/非表示にするコードがいくつかあります。ボタンが表示されている場合、フォームを送信するときに、表示されているすべてのチェックボックスが実際にチェックされていることを確認する必要があります。

これまでの私の試みは次のとおりです。

$("form").submit(function() {
    if ($(':checkbox:visible:not(:checked)').filter(function() {
    return $(this).css('visibility') != 'hidden';
    }).length) {
        alert('return false');
    }
});

問題は、フィルターの後の$（this）がチェックボックスではなくフォームであることにあるようです。

あなたより、どんな提案も大歓迎です！

4

4 に答える 4

3

これはどうですか: http://jsfiddle.net/zerkms/WUGh3/1/

if ($('.checkbox:visible:not(:checked)').length) {
    alert('not all visible checkboxes are checked');
    return false;
}

したがって、チェックされていない可視チェックボックスがあるかどうかを確認するだけです。もしそうなら - 戻るfalse

PS: @bažmegakapa のアドバイスによると、同じものをより効率的に書く方法は次のとおりです。

if ($('.checkbox:not(:checked)').filter(':visible').length) {
    alert('not all visible checkboxes are checked');
    return false;
}
于 2012-05-02T09:30:10.370 に答える
2

あなたのソリューションでthisは、フォーム自体を参照しis()、jQuery コレクションの最初の要素である 1 つの要素でのみ実行されるため、別のアプローチを取る必要があります。

このコンパクトなものでは、表示されているものを単純にフィルタリングしてから、チェックされていないものをフィルタリングし、存在する場合は false を返します (最終的に返されるのは==演算子の結果です)。

$("form").submit(function() {
    return $('.checkbox').filter(':visible').not(':checked').length == 0;
});

jsFiddle デモ

注: @zerkms のソリューションと比較して、基本的にセレクターを分割します。:visibleは、ネイティブ ブラウザー セレクター エンジンが利用可能な場合にそれを使用できるセレクターではありません (マニュアルの追加情報を参照してください)。

于 2012-05-02T09:30:31.713 に答える
1

この行：

$('.checkbox').filter(':visible')

class に表示されているチェックボックスがあるかどうかを確認しますcheckbox。

次に、フォームオブジェクトをチェックして、チェックされているかどうかを確認します。フォームをチェックできないため、チェックされていません。

あなたはおそらく次のようなことをしたいと思うでしょう:

var checkBoxes = $('.checkbox').filter(':visible');
var returnValue = true;

// Check if each visible checkbox is checked
checkBoxes.each(function(){
    if(! $(this).is(':checked'))
    {
      returnValue = false;
    }
});

return returnValue;

ここにあなたのための実用的なデモがあります

于 2012-05-02T09:25:06.430 に答える
-2

私が見る限り、 $(this) はチェックボックスではなくフォームを参照しています。

于 2012-05-02T09:24:56.583 に答える