Question

我有一个页面，我使用单选按钮来确定一些用户选项。选项1中有两个选项，选项2是独立的。

HTML如下：

<div>
  <input type="radio" name="level0" value="D" id="D" checked="checked" />
  <label for="D">D</label>
  <div class="sub1">
    <div>
      <input type="radio" name="level1" value="D0" id="D0" />
      <label for="D0">D0</label>
    </div>
    <div>
      <input type="radio" name="level1" value="D1" id="D1" checked="checked" />
      <label for="D1">D1</label>
    </div>
  </div>
  <input type="radio" name="level0" value="E" id="E" />
  <label for="E">E</label>
  <br>
  <br>
  <button id="cancel-btn" type="button">Cancel</button>
</div>

问题围绕取消按钮功能。假设已检查＆＃39;＆＃39;＆＃39;属性是默认设置，如果我开始更新这些属性然后决定不进行更新并点击取消按钮，我希望它恢复为默认设置。

处理此问题的JavaScript摘录是

$('#E').click(function (event) {
    $("#D0").attr('checked', false);
    $('#D1').attr('checked', false);
});
$('#D0').click(function (event) {
    $('#E').attr('checked', false);
    $('#D').attr('checked', true);
});
$('#D1').click(function (event) {
    $('#E').attr('checked', false);
    $('#D').attr('checked', true);
});
$('#cancel-btn').click(function (event) {
    $('input[type=radio]').prop('checked', function () {
        return this.getAttribute('checked') == 'checked';
    });
});

问题是外部单选按钮正在重置，但内部（D0和D1）没有重置。

思想？

Answer 1

在取消按钮代码

中使用此功能

$('input[type=radio]').attr('checked', false);
$('input[type=radio][default]').attr('checked', true);

这可能是@billy的意思，当他说你应该添加一个任意的（在这种情况下是“默认”）属性

使用取消按钮重置嵌套单选按钮选择

1 个答案: