当单选按钮被选中时，复选框变为必需

我试图编写jQuery代码来验证是否检查某个单选按钮。如果选中该单选按钮，则会出现4个复选框，并且必须至少检查其中一个复选框。如果不是，浏览器将显示警报，而在另一种情况下，将发送表单。当单选按钮被选中时，复选框变为必需

问题是，即使我选择了一个复选框，我得到浏览器警报，我没有选中任何复选框，并且表单不会提交。 Thx提前。

HTML：

<form method='POST' action='#'> 
     <input type='radio' id='D_odg' name='c' value=''> 

     <div id='D_div'> 

      <input type='checkbox' value='1' name='c3' id='inputD1'><label>Label1</label> 
      <input type='checkbox' value='2' name='c3' id='inputD2'><label>Label2</label> 
      <input type='checkbox' value='3' name='c3' id='inputD3'><label>Label3</label> 
      <input type='checkbox' value='4' name='c3' id='inputD4'><label>Label4</label> 

     </div> 

     <input type='submit' value='Send' id='button'> 

</form>

的jQuery：

$('#button').click(function() { 
    var checkedboxes = $('.D_div :checkbox:checked').length; 
    if ($('#D_odg').prop('checked') && checkedboxes===0{ 
      alert('At least 1 checkbox must be selected'); 
      return false;    
    }else{ 
      alert('Form submited!'); 
    }   
});

来源

2015-09-04 MadMaxa

'.'为类，而'＃'为id。您的选择器不同 – guradio

与您的代码几个问题。

1）你有不正确的选择器来定位复选框的父div。 D_div是div的标识，而不是class。因此，你需要使用id选择#代替类选择.的：

var checkedboxes = $('#D_div :checkbox:checked').length; 
        //^^ ID selector here

2）你有语法错误。你还没有使用结束括号因为如果条件

if ($('#D_odg').prop('checked') && checkedboxes===0) 
               // ^^ missing brace

Working Demo

来源

2015-09-04 11:19:58

它的工作原理，非常感谢：D – MadMaxa

@Prism：很高兴它有帮助:) –

试试这个：你已经使用类选择，而不是id选择了D_div。你也可以改变$('#D_odg').prop('checked')到$('#D_odg').is(':checked')看起来更具可读性，请参阅=== 0后，下面的代码

$('#button').click(function() { 

     var checkedboxes = $('#D_div :checkbox:checked').length; 

     if ($('#D_odg').is(':checked') && checkedboxes===0){ 
      alert('At least 1 checkbox must be selected'); 
      return false; 

     }else{ 

      alert('Form submited!'); 

     }   

    });

来源

2015-09-04 11:20:27

道具返回值及其类型。 'prop（'checked'）'和'is（'：checked'）'将返回相同的值。 –

@MilindAnantwar哦，好吧..我不知道。感谢您的纠正 –

你缺少右括号。此外：复选框：选中返回0.此作品：

$('#button').click(function() { 
    var checkedboxes = $('[name="c3"]:checked').length; 
    if ($('#D_odg').prop('checked') && checkedboxes===0){ 
     alert('At least 1 checkbox must be selected'); 
     return false; 
    }else{ 
     alert('Form submited!'); 
    }   
});

来源

2015-09-04 11:27:55 ukdesignservices

当单选按钮被选中时，复选框变为必需

回答

相关问题