通过JavaScript更新名称属性时，防止单选按钮丢失选中状态

Prevent radio buttons from losing checked state when updating name attribute via JavaScript

本文关键字：单选按钮 状态 更新 JavaScript 属性 通过      更新时间：2023-09-26

我有一个结构化和层次化的HTML元素集合。添加或删除元素时，我会更新其同级元素，以便在元素属性中反映正确的顺序。此操作的一部分涉及更新单选按钮上的名称属性。

由于单选按钮按名称分组，更改名称会导致单选按钮的"已选中"状态丢失。

关于我遇到的问题，请查看http://jsfiddle.net/UNQjU/12/-检查一个单选按钮，然后执行代码，你会看到状态丢失。我正在寻找一种变通方法，允许我在操作名称属性时保持每个单选按钮的选中状态。

此代码在您的JS Fiddle示例中运行良好。如果您将HTML更改为：

<input type="radio" name="group1" checked="checked"> Option 1 <br/>
<input type="radio" name="group1"> Option 2 <br/>
<input type="radio" name="group1"> Option 3 <br/>

然后"Run"the fiddle，复选框名称被更改，复选框保持选中状态。

别忘了标签

<label for="group1_a">
    <input type="radio" id="group1_a" name="group1" checked="checked">
    Option 1</label><br/>
<label for="group1_b">
    <input type="radio" id="group1_b" name="group1">
    Option 2</label><br/>
<label for="group1_c">
    <input type="radio" id="group1_c" name="group1">
    Option 3</label><br/>
相关文章：