javascript - 为什么在 iOS 中使用列表时字段集中的复选框不能正确启用？

Question

使用以下代码：

document.getElementById('fs1').disabled = true;
document.getElementById('fs2').disabled = true;
document.getElementById('fs3').disabled = true;

document.getElementById('enable').addEventListener('click', function(e) {
  e.preventDefault();
  document.getElementById('fs1').disabled = false;
});

document.getElementById('disable').addEventListener('click', function(e) {
  e.preventDefault();
  document.getElementById('fs1').disabled = true;
});

<form>
  <button id="enable">ENABLE</button>
  <button id="disable">DISABLE</button>
  <fieldset id="fs1">
    <ul>
      <li>
        <label>A <input type="checkbox"></label>
        <fieldset id="fs2">
          <label>A1 <input type="text"></label>
        </fieldset>
      </li>
      <li>
        <label>B <input type="checkbox"></label>
        <fieldset id="fs3">
          <label>B1 <input type="text"></label>
        </fieldset>
      </li>
    </ul>
  </fieldset>
</form>

单击“启用”应激活第一个（外部）字段集，因此激活复选框 A 和 B。在 iOS Safari/Chrome 中，当使用 HTML 列表来构造字段时，情况并非如此。相反，只有复选框 A 变为活动状态。

这是浏览器错误，还是我误解了规范/做了一些愚蠢的事情？

在此处添加到 codepen 的外部链接，因为它在移动设备上的 SO 上似乎没有显示为可运行状态：

https://codepen.io/jamieburchell/pen/WNRgdeL

标签： javascripthtmliossafariwebkit