2012-02-27 108 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?请我回答 – 2012-02-27 03:30:53

+0

没关系的downvote。这是一个很好的问题,包括代码和小提琴。选民可能认为你应该能够通过搜索StackOverflow找到答案。然而,我的经验是,任何愿意花时间张贴小提琴和代码的人都已经尝试过搜索。 – mrtsherman 2012-02-27 03:33:57

回答

6

您可以在选择器表达式中使用:checked假选择器。将其与.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

在您的提醒中,您从双引号开始,以单..结束..它会中断 – 2012-02-27 03:34:41

+0

这是一个很好的答案。比我更好,因为它更具可读性。 http://jsfiddle.net/mrtsherman/BghzK/3/ – mrtsherman 2012-02-27 03:40:11

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; 
    } 
相关问题