Question

我设置了两个单选按钮，我想要的是如果我在第一组中选择是，它应该自动选择其他一个为是这里是我的代码

<input type="checkbox" name="saver" value="yes" id="saver"> Yes 
<input type="checkbox" name="saver" value="no" id="saver"> No 

<input type="checkbox" name="sendmail" value="yes" id="sendmail"> Yes
<input type="checkbox" name="sendmail" value="no" id="sendmail"> No

所以我想要的是，如果我在第一组选择是，它应该自动选择第二组的是，Jquery到这里

$('#saver').keyup(function(){
   var checkbox_value = $('#saver:checked').val();

   if(checkbox_value == 'yes')
   {
      $('input[name="sendmail"]').attr('checked', true);
   }
});

它会自动选择另一个组，但它会变为no而不是yes

Answer 1

您的HTML需要使用唯一ID

<input type="checkbox" name="saver" value="yes" id="saver-yes"> Yes 
<input type="checkbox" name="saver" value="no" id="saver-no"> No 

<input type="checkbox" name="sendmail" value="yes" id="sendmail-yes"> Yes
<input type="checkbox" name="sendmail" value="no" id="sendmail-no"> No

这个javascript很简单（并且有效 - 见证明：http://jsfiddle.net/kSVx7/1/）

$('#saver-yes').change(function() {

  if($('#saver-yes:checked').val() == 'yes')
     $('#sendmail-yes').attr('checked', true);


});

通过使用更改代替键盘，您还可以执行鼠标点击（甚至触摸事件）。

通过引用唯一的id，你所引用的元素没有歧义，所以jQuery知道要操作什么。

Answer 2

试试这个 -

$('#saver').change(function() {
    var checkbox_value = $('#saver:checked').val();

    if (checkbox_value == 'yes') {
        $('input[name="sendmail"][value="yes"]').attr('checked', true);
    }
});

我已将'keyup'事件更改为'change'，但如果您愿意，可以将其更改回'keyup'。

工作演示 - http://jsfiddle.net/XyKM7/

Answer 3

ID只能定义一次，你应该使用change而不是keyup。

http://jsfiddle.net/7hq2V/1/

HTML：

<input type="checkbox" name="saver" value="yes" id="saver-yes"> Yes 
<input type="checkbox" name="saver" value="no" id="saver-no"> No 

<input type="checkbox" name="sendmail" value="yes" id="sendmail-yes"> Yes
<input type="checkbox" name="sendmail" value="no" id="sendmail-no"> No

JS：

$('#saver-yes').change(function() {
    if ($(this,':checked')) {
        $('#sendmail-yes').attr('checked', true);
    }
});

Answer 4

有几件事......

如果每个复选框组中的值互斥，则radiobuttons将是更加语义正确的选择。

其次，设置值的脚本部分不仅仅是“是”复选框，而是整个组 - 您需要添加另一个过滤器来执行此操作：

$（'input [name =“sendmail”] [value =“yes”]'）。attr（'checked'，true）

如果你把它们留作复选框，你还需要处理取消选中no框。

密钥上的Jquery检查单选按钮

4 个答案: