jQueryを使用して、グループ内のラジオボタンがオンになっていないかどうかを確認する


107

私は問題を抱えています。ラジオボタングループ内のラジオボタンが1つもチェックされていない場合はJQueryでチェックする必要があります。これにより、ユーザーがオプションをチェックし忘れた場合にjavascriptエラーを発生させることができます。

次のコードを使用して値を取得しています

var radio_button_val = $("input[name='html_elements']:checked").val();

回答:


146
if (!$("input[name='html_elements']:checked").val()) {
   alert('Nothing is checked!');
}
else {
  alert('One of the radio buttons is checked!');
}

17
チェックされたラジオボタンの値が ""の場合、これは失敗します
ScottE

1
@ScottE-優れた点-ローランドが受け入れない場合は、この回答を削除します。
ドミニクロジャー2010年

私はあなたがそれを単に変更して.val() == ""削除する!ことができると思います、そしてあなたはすべて準備ができているでしょう。
Doug Neiner、2010年

@Doug-それでも、ScottEが言及した問題はありませんか?.val()チェックされたラジオボタンがあったら何が戻りますvalue=""か?(私はあなたがそれがかなりありそうもないケースであると主張することができると思いますが)。
ドミニクロジャー

1
申し訳ありませんが、私のコメントは紛らわしいものでした。テスト全体を次のようにすることを意味しました。if ($("input[name='html_elements']:checked").val() == "")これにより、「何もチェックされていません」という警告が表示されます
Doug Neiner

144

私は使っています

$("input:radio[name='html_radio']").is(":checked")

ラジオグループのすべてのアイテムがチェックされていない場合はFALSEが返され、アイテムがチェックされている場合はTRUEが返されます。


3
この回答は、ラジオボタングループに選択された値があるかどうかを確認するのに確実に役立ちました。スレッドでベストアンサー。
アンディクック

1
ドミニク・ロジャーとハコボ・エルナンデスの答えはどちらもうまくいきます。個人的には、行頭で先頭のNOT(!)を使用しないようにしています。数年後、それを見落としてロジックを逆にするとデバッグが難しくなります... is( ":checked")はあなたがやっていることは非常に明確です-最良の答え。
スコット

32

あなたはこのようなことをすることができます:

var radio_buttons = $("input[name='html_elements']");
if( radio_buttons.filter(':checked').length == 0){
  // None checked
} else {
  // If you need to use the result you can do so without
  // another (costly) jQuery selector call:
  var val = radio_buttons.val();
}

2
最初の2行をちょうど絞ってみませんif ($("input[name='html_elements']:checked").length == 0){か?
Powerlord

7
可能ですが、値が存在することを示した場合、値を取得するために別の完全なjQuery選択が必要になります。
Doug

5
if ($("input[name='html_elements']:checked").size()==0) {
   alert('Nothing is checked!');
}
else {
  alert('One of the radio buttons is checked!');
}



2

これは簡単な例だと思います。ラジオのグループのラジオがチェックされたかどうかをチェックする方法です。

if($('input[name=html_elements]:checked').length){
    //a radio button was checked
}else{
    //there was no radio button checked
} 

0

私はこれだけシンプルに使っています

HTML

<label class="radio"><input id="job1" type="radio" name="job" value="1" checked>New Job</label>
<label class="radio"><input id="job2" type="radio" name="job" value="2">Updating Job</label>


<button type="button" class="btn btn-primary" onclick="save();">Save</button>

脚本

 $('#save').on('click', function(e) {
    if (job1.checked)
        {
              alert("New Job"); 
        }
if (job2.checked)
        {
            alert("Updating Job");
        }

}

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.