选中的 HTML 复选框 - HTML

HTML 复选框（Checkbox）是一种常见的用户界面元素，通常用于允许用户从一组选项中选择多个选项。本文将介绍如何通过 HTML 和 JavaScript 来处理选中的复选框。

HTML 复选框

HTML 中的复选框通过 <input> 元素来定义，其 type 属性设置为 "checkbox"。例如，要创建一个简单的复选框，可以使用以下代码：

<input type="checkbox" name="option1" value="value1"> Option 1

上面的代码创建了一个复选框和一个标签，标签文本为 "Option 1"。在用户单击复选框时，浏览器将向服务器发送一个带有 name 和 value 参数的 HTTP 请求，其中 name 参数为 "option1"，value 参数为 "value1" 。

请注意，在 HTML 中，复选框的默认值为 "on"，这意味着如果您在复选框上没有指定 value 属性，则提交表单时服务器将接收到一个值为 "on" 的变量。

JavaScript 处理选中的复选框

要检测复选框是否被选中，可以使用 JavaScript。首先，我们需要获取对复选框的引用。可以通过其 name 或 id 属性来获取。

var checkbox = document.getElementById("myCheckBox");

一旦我们获得了复选框的引用，我们可以使用 checked 属性来检查它是否被选中：

if (checkbox.checked) {
  // 复选框已选中
}

如果要同时检查多个复选框的状态，则可以使用循环和数组：

var checkboxes = document.getElementsByName("options");
for (var i = 0; i < checkboxes.length; i++) {
  if (checkboxes[i].checked) {
    // 处理选中的复选框
  }
}

总结

本文介绍了 HTML 复选框的基本用法和 JavaScript 处理选中的复选框的方法。希望这篇文章对你有所帮助！