29

すべてのチェックボックスがオフになっているかどうかをチェックする関数を作成しようとしています。テキストボックスにも同様の機能があります。私はこれまでチェックボックスを操作したことがないので、に変更input[type=text]する以外にどのようにチェックボックスを適応させるかわかりませんinput[type=checkbox]。

誰かが私を助けることができますか？ありがとう。 

var textinputs = document.querySelectorAll('input[type=text]'); 
var empty = [].filter.call( textinputs, function( el ) {
     return !el.value
});

    if (textinputs.length == empty.length) {
        alert("None filled");
        return false;
}
4

7 に答える 7

36

次のようにしてください。

var textinputs = document.querySelectorAll('input[type=checkbox]'); 
var empty = [].filter.call( textinputs, function( el ) {
   return !el.checked
});

if (textinputs.length == empty.length) {
    alert("None filled");
    return false;
}
于 2013-02-10T18:35:05.620 に答える
26

を使用できることを考えると、少し単純化できますquerySelectorAll()。

var checked = document.querySelectorAll('input:checked');

if (checked.length === 0) {
    // there are no checked checkboxes
    console.log('no checkboxes checked');
} else {
    // there are some checked checkboxes
    console.log(checked.length + ' checkboxes checked');
}

JS Fiddle (チェックボックスはチェックされていません) .

JS Fiddle (いくつかのチェックボックスがチェックされています) .

または、関数で使用するために、チェックボックスがオンになっているかどうかを示すブール値だけが必要な場合:

var isChecked = document.querySelectorAll('input:checked').length === 0 ? false : true;
return isChecked;

概念実証のデモ。

もちろん、変数の作成を避けて、単純に 3 項の結果を返すこともできます。私は変数を使用して、正確に何を返している/テストしているのかを明確にしようとしました。

参照：

于 2013-02-10T18:44:17.977 に答える
3

クラスまたはIDで名前の間隔を空けることをお勧めします

var checked = document.querySelectorAll('input.myClassName:checked');

//or

var checked = document.querySelectorAll('input#myIdName:checked');

if (checked.length === 0) {

    console.log('no checkboxes checked');
} else {

    console.log(checked.length + ' checkboxes checked');
}
于 2017-12-13T21:53:29.703 に答える