javascript - 选择两个具有相同名称、id、值的单选按钮

Question

在我的页面上，我有两个单选按钮表示是，两个单选按钮表示否。 如果我在一个地方检查"is"，它会检查第二个"is"按钮，或者如果我检查“否”，那么第二个“否”也会检查，我该怎么做。

以下是我的代码:

<fieldset>
   <input checked="checked" id="search_by_range_no" name="search_by_range" type="radio" value="no">
   <input class="input-long" id="size10" name="size10" type="text" value="27">
   <br>
   <input id="search_by_range_yes" name="search_by_range" type="radio" value="yes">
   <input class="input-long" id="size1" name="size1" type="text" value="15 - 150">
   <br>
   <input checked="checked" id="search_by_range_no" name="search_by_range" type="radio" value="no">
   <input class="input-long" id="size20" name="size20" type="text" value="65">
   <br>
   <input id="search_by_range_yes" name="search_by_range" type="radio" value="yes">
   <input class="input-long" id="size2" name="size2" type="text" value="25 - 250">
   <br>
</fieldset>

如何同时选择两个 radio ？

Answer 1

同一单选按钮组中不能选中多个按钮。您需要为这两个集合指定不同的名称。我使用了 search_by_range_A 和 search_by_range_B。而且 ID 必须是 unix。

要使其自动检查另一个按钮，请使用 .change() 处理程序获取该值，然后选择具有相同值的另一个复选框并检查它。

$(":radio").change(function() {
  var value = $(this).val();
  $(":radio[value=" + value + "]").prop("checked", true);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<fieldset>
  <input checked="checked" id="search_by_range_A_no" name="search_by_range_A" type="radio" value="no">
  <input class="input-long" id="size10" name="size10" type="text" value="27">
  <br>
  <input id="search_by_range_A_yes" name="search_by_range_A" type="radio" value="yes">
  <input class="input-long" id="size1" name="size1" type="text" value="15 - 150">
  <br>
  <input checked="checked" id="search_by_range_B_no" name="search_by_range_B" type="radio" value="no">
  <input class="input-long" id="size20" name="size20" type="text" value="65">
  <br>
  <input id="search_by_range_B_yes" name="search_by_range_B" type="radio" value="yes">
  <input class="input-long" id="size2" name="size2" type="text" value="25 - 250">
  <br>
</fieldset>