获取在特定 div 中选中的单选按钮的所有值

Question

我和我的朋友正试图解决这个问题。我们想要获取在 div 中选中的单选按钮的所有值

---

第一部分

名称 = 已检查无线电 1

名称 = 未选中的无线电 2

名称 = 已检查的无线电 3

---

二级

名称 = 未选中的无线电 1（已选中 div1 中的 cuz）

名称 = 未选中的无线电 2

名称 = 未选中的无线电 3（与无线电 1 相同）

所以场景是，当我点击div2无线电3时，将取消选中div1无线电3，并检查div2无线电3。我想打印每个 div 检查的所有值

网页：

<!-- ADDRESS 1  -->

<input type="radio" id="11" name="addressname1" value="address1" checked> 

<label for="11">address1</label>

<input type="radio" id="12" name="addressname2" value="address2"> 

<label for="12">address2</label>

<input type="radio" id="13" name="addressname3" value="address3" > 

<label for="13">address3</label>

<!-- END ADDRESS 1 -->

<br>

<input type="text" id="1" value="" placeholder="result of address 1 here">

<br>

<br>

<!-- ADDRESS 2  -->

<input type="radio" id="21" name="addressname1" value="address1" > 

<label for="21">address1</label>

<input type="radio" id="22" name="addressname2" value="address2" checked> 

<label for="22">address2</label>

<input type="radio" id="23" name="addressname3" value="address3" checked>   

<label for="23">address3</label> 

<!-- END ADDRESS 2 -->

 <br>

<input type="text" id="2" value="" placeholder="result of address 2 here">

Answer 1

您可以将单选按钮包装在单独的 div 容器中。然后，您可以使用 和 来定位选中的单选按钮。最后使用地图获取值。$('#Div1 :radio:checked')$('#Div2 :radio:checked')您可以尝试以下方法：$('#Div1 :radio').each(function(){&nbsp; var cls = $(this).attr('name');&nbsp; var ck = $(this).attr('checked');&nbsp; if(ck != 'checked'){&nbsp; &nbsp; $(`#Div2 [name=${cls}]`).attr('checked', true);&nbsp; }});$('#Div2 :radio').click(function(){&nbsp; var cls = $(this).attr('class');&nbsp; var ck = $(this).attr('checked');&nbsp; if(ck != 'checked'){&nbsp; &nbsp; $(`#Div1 [name=${cls}]`).attr('checked', true);&nbsp; }&nbsp; var checkedDiv1 = $('#Div1 :radio:checked').map((i,el) => $(el).attr('value')).get().join(',');&nbsp; $('#1').val(checkedDiv1);&nbsp; var checkedDiv2 = $('#Div2 :radio:checked').map((i,el) => $(el).attr('value')).get().join(',');;&nbsp; $('#2').val(checkedDiv2);});$('#Div1 :radio').click(function(){&nbsp; var cls = $(this).attr('class');&nbsp; var ck = $(this).attr('checked');&nbsp; if(ck != 'checked'){&nbsp; &nbsp; $(`#Div2 [name=${cls}]`).attr('checked', true);&nbsp; }&nbsp; &nbsp;var checkedDiv1 = $('#Div1 :radio:checked').map((i,el) => $(el).attr('value')).get().join(',');&nbsp; $('#1').val(checkedDiv1);&nbsp; var checkedDiv2 = $('#Div2 :radio:checked').map((i,el) => $(el).attr('value')).get().join(',');;&nbsp; $('#2').val(checkedDiv2);});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><!-- ADDRESS 1&nbsp; --><div id="Div1">&nbsp; <input type="radio" id="11" name="addressname1" value="address1" checked>&nbsp;&nbsp; <label for="11">address1</label>&nbsp; <input type="radio" id="12" name="addressname2" value="address2">&nbsp;&nbsp; <label for="12">address2</label>&nbsp; <input type="radio" id="13" name="addressname3" value="address3" >&nbsp;&nbsp; <label for="13">address3</label></div><!-- END ADDRESS 1 --><br><input type="text" id="1" value="" placeholder="result of address 1 here"><br><br><!-- ADDRESS 2&nbsp; --><div id="Div2">&nbsp; <input type="radio" id="21" name="addressname1" value="address1" >&nbsp;&nbsp; <label for="21">address1</label>&nbsp; <input type="radio" id="22" name="addressname2" value="address2" checked>&nbsp;&nbsp; <label for="22">address2</label>&nbsp; <input type="radio" id="23" name="addressname3" value="address3" checked>&nbsp; &nbsp;&nbsp; <label for="23">address3</label>&nbsp;<div><!-- END ADDRESS 2 -->&nbsp;<br><input type="text" id="2" value="" placeholder="result of address 2 here">