Question

我有以下网络表单标记：

<input type="radio" value="1" name="option[1]" class="abc">
<input type="radio" value="2" name="option[1]" class="def">
<input type="radio" value="3" name="option[1]" class="ghi">
<input type="radio" value="1" name="option[2]" class="abc">
<input type="radio" value="2" name="option[2]" class="def">
<input type="radio" value="3" name="option[2]" class="ghi">
<input type="radio" value="1" name="option[3]" class="abc">
<input type="radio" value="2" name="option[3]" class="def">
<input type="radio" value="3" name="option[3]" class="ghi">

如何设置option[2]和option[3]按钮以获得option[1]的相同选择？

可以通过某种jQuery赋值完成，还是需要创建自己的if / then语句集？

这是我的if / then语句（它有效，只是为了让它更简洁一点）：

if ( $('input.abc[name="option\\[1\\]"]').prop('checked') == true) {
  $('input.abc[name="option\\[2\\]"]').prop('checked', true);
  $('input.abc[name="option\\[3\\]"]').prop('checked', true);
}
else if ( $('input.def[name="option\\[1\\]"]').prop('checked') == true) {
  $('input.def[name="option\\[2\\]"]').prop('checked', true);
  $('input.def[name="option\\[3\\]"]').prop('checked', true);
}
else if ( $('input.ghi[name="option\\[1\\]"]').prop('checked') == true) {
  $('input.ghi[name="option\\[2\\]"]').prop('checked', true);
  $('input.ghi[name="option\\[3\\]"]').prop('checked', true);
}

Answer 1

检查这个小提琴。我添加了一个解决方案。

选择第一组输入，其中包含option1，绑定事件。
获取所选输入元素的值。
选择具有公共值的输入并将其指定为已选中。

http://jsfiddle.net/n8CdM/751/

    $('input[name="option1"]').on('click', function () {
       var selection = $(this).val();
       $('input[value="' + selection + '"]').attr('checked', true);
    });

Answer 2

$('input[name="option[1]"]').change(function () {
    $('input[name="option[2]"],input[name="option[3]"]').val([$(this).val()])
})

<强> jsFiddle example

Answer 3

<input type="radio" value="1" name="option[1]" class="class1">
<input type="radio" value="2" name="option[1]" class="class2">
<input type="radio" value="3" name="option[1]" class="class3">
<input type="radio" value="1" name="option[2]" class="class1">
<input type="radio" value="2" name="option[2]" class="class2">
<input type="radio" value="3" name="option[2]" class="class3">
<input type="radio" value="1" name="option[3]" class="class1">
<input type="radio" value="2" name="option[3]" class="class2">
<input type="radio" value="3" name="option[3]" class="class3">

将类添加到输入并尝试jquery代码：

$("input[type=radio]").change(function() {
   $("."+$(this).attr('class')).attr('selected', 'selected');
});

例如

;）

Answer 4

你可以在html中添加一个属性

<input type="radio" value="1" name="option[2]" checked="checked" >

或者你可以用jQuery添加它

$('input[name="option[2]"]').attr('checked','checked');

jQuery如何自动同步单选按钮组

4 个答案: