4

我有这组单选按钮,比方说

radio 1
radio 2
radio 3
radio 4

和一个复选框;

checkbox 1

我想要实现的是,当我单击收音机 1 或收音机 3 时,复选框 1 将被选中。如果复选框被选中并且当您单击无线电 2 或无线电 4 时,该复选框将被取消选中。

我已经为它实现了一些代码,但它有一个小故障,当我点击收音机 1 时,它会选中复选框,但是当我点击收音机 3 时,它会取消选中复选框。

据说,当我单击收音机 1 时,它会检查,即使我单击收音机 3,它也不应该取消选中该复选框。

这是我的代码:

jQuery('#radio1 input:radio, #radio3 input:radio').click(function(){
    var checkbox = jQuery('#checkbox1');
    checkbox.attr('checked', !checkbox.attr('checked'));
});
4

3 回答 3

3

HTML 代码:

Radio1 :<input type="radio" id="radio1" name="radio"/><br>
Radio2 :<input type="radio" id="radio2" name="radio"/><br>
Radio3 :<input type="radio" id="radio3" name="radio"/><br>
Radio4 :<input type="radio" id="radio4" name="radio"/><br>
Checkbox :<input type="checkbox" id="checkbox1"/>

jQuery代码:

 jQuery('#radio1 , #radio3').click(function(){      
jQuery('#checkbox1').attr('checked', true);   
 });        
jQuery('#radio2 , #radio4').click(function(){      
 jQuery('#checkbox1').attr('checked', false);  
 }); 

现场演示:

http://jsfiddle.net/hQbpZ/

于 2012-05-04T04:59:17.983 回答
2
$('input[type="radio"]').click(function(){
   var checkbox = $('#checkbox1');
   switch(this.id){
      case 'radio1':
      case 'radio3':
      checkbox.attr('checked', true);
      break;

      case 'radio2':
      case 'radio4':
      checkbox.attr('checked', false);
      break;
   }
});
于 2012-05-04T04:50:49.020 回答
1
jQuery('#radio1, #radio3').click(function(){
    jQuery('#checkbox1').prop('checked', true);
});

jQuery('#radio2, #radio4').click(function(){
    jQuery('#checkbox1').prop('checked', false);
});

尽管您可以通过许多其他方式做到这一点。再举一个例子:

jQuery(':radio').change(function(){
    var toCheck = this.id == 'radio1' || this.id == 'radio3'; 
    jQuery('#checkbox1').prop('checked', toCheck);
});

演示(标记取自@Matrix)

于 2012-05-04T04:50:52.920 回答