2012-02-27 11 views
4

がどのように私は、チェックボックスやラジオボタンがチェックされているかどうかを判断するためのjQueryを使用する選択された場合は?ここでチェック任意のラジオやチェックボックスが

は私のHTMLです:ここでは

<form> 
<input type="radio" name="sex" value="male" /> Male<br /> 
<input type="radio" name="sex" value="female" /> Female 
</form> 

<span id="check1">check</span> 

<form> 
<input type="checkbox" name="vehicle" value="Bike" /> I have a bike<br /> 
<input type="checkbox" name="vehicle" value="Car" /> I have a car 
</form> 

<span id="check2">check</span> 

は、いくつかの疑似ではJavaScriptです:

$("#check1").click(function(){ 
    if(any radio is selected){ 
     alert("Please select one radio"); 
    } 
}) 

$("#check2").click(function(){ 
    if(any checkbox is selected){ 
     alert("Please select minimum one checkbox"); 
    } 
}) 

それはjQueryのでは可能ですか? jsfiddle上

ライブ例:助けをhttp://jsfiddle.net/BghzK/ ありがとう!

+0

なぜ-1を試すことができますか?私は –

+0

ネヴァーマインドdownvoteを答えてください。コードとフィドルを含むよく形成された質問です。有権者はおそらく、StackOverflowを検索することで答えを見つけることができるはずだと考えました。しかし、私の経験では、フィドルとコードを投稿する時間を取ってくれる人は誰でも既に検索を試みています。 – mrtsherman

答えて

6

はあなたのセレクタ式に:checked pseudoselectorを利用することができます。戻ってきたどのように多く見ること.lengthと組み合わせます。この場合、選択されたすべてのラジオボタンが表示され、長さがゼロかどうかが確認され、選択されていないことが示されます。

http://jsfiddle.net/mrtsherman/BghzK/2/

$("#check1").click(function(){ 
    if($('input[type=radio]:checked').length == 0){ 
     alert("Please select one radio"); 
    } 
}) 

$("#check2").click(function(){ 
    if($('input[type=checkbox]:checked').length == 0){ 
     alert("Please select minimum one checkbox"); 
    } 
}) 

​ 
1
var rdo = $('input[name="group"]:checked'); 
var boxes = $('input[type="checkbox"]:checked'); 

if(rdo.length == 0) 
    alert("Please select one radio"); 

if(boxes.length == 0) 
    alert("Please select minimum one checkbox"); 
2

jquery Validationプラグインが自動的に行われます。ラジオボタンの場合は、あなただけの形で要素requiredを作成する必要があります。

4
if(!$(':radio:checked').length){ 
    alert('Please select one radio'); 
} 
+2

アラートの中で二重引用符で始まり、単一で終わり..それは壊れるでしょう –

+0

これは良い答えです。もっと読みやすいので、私よりも優れています。 http://jsfiddle.net/mrtsherman/BghzK/3/ – mrtsherman

3

あなたは使用する必要があります( ":チェックする")であるセレクタで。以下のサンプルコード:

$(function() { 
      $("#check1").click(function(){ 
       if(!($("input[name='sex']").is(":checked"))){ 
        alert("Please select one radio"); 
       } 
      }) 

     $("#check2").click(function(){ 
      if(!($("input[name='vehicle']").is(":checked"))){ 
       alert("Please select minimum one checkbox"); 

      } 
     }) 

     }); 
1

あなたはこの方法この単純な

var chkvalue = $('input[name="sex"]:checked').val(); 
    if(chkvalue =="") 
    { 
    alert("Please checked the radio button"); 
    return; 
    } 
関連する問題