选择第一个选项取消选择 - HTML

在HTML中，我们可以使用<input>元素创建各种表单元素，包括单选框（Radio）和复选框（Checkbox）。

如果有多个单选框或复选框，我们可能需要实现某些行为，比如选择其中一个选项时，取消其他选项的选择。

下面是一个示例HTML代码片段，展示了如何使用JavaScript实现这一行为：

<form>
  <input type="checkbox" name="option1" id="option1">
  <input type="checkbox" name="option2" id="option2">
  <input type="checkbox" name="option3" id="option3">
</form>

<script>
  const checkboxes = document.querySelectorAll('input[type="checkbox"]');

  checkboxes.forEach((checkbox) => {
    checkbox.addEventListener('click', () => {
      if (checkbox.checked) {
        uncheckOtherCheckboxes(checkbox);
      }
    });
  });

  function uncheckOtherCheckboxes(checkedCheckbox) {
    checkboxes.forEach((checkbox) => {
      if (checkbox !== checkedCheckbox) {
        checkbox.checked = false;
      }
    });
  }
</script>

在此示例中，我们首先获取所有的复选框元素，然后为每个元素添加一个点击事件。当某个复选框元素被选中时，我们调用了uncheckOtherCheckboxes()函数，从而取消其他选项的选择。

uncheckOtherCheckboxes()函数遍历了所有的复选框元素，如果当前遍历到的元素与被选中的元素不同，则将其设置为未选中状态。

使用类似这样的代码，你可以在HTML中实现一些常见的表单行为。