html check 获取选中状态
时间: 2024-05-03 20:17:50 浏览: 18
如果您想获取 HTML 表单中 checkbox 的选中状态,可以使用 JavaScript 来实现。以下是一种实现方式:
HTML 代码:
```html
<form>
<input type="checkbox" id="checkbox1" name="checkbox1" value="value1">
<label for="checkbox1">选项1</label><br>
<input type="checkbox" id="checkbox2" name="checkbox2" value="value2">
<label for="checkbox2">选项2</label><br>
<input type="checkbox" id="checkbox3" name="checkbox3" value="value3">
<label for="checkbox3">选项3</label><br>
</form>
```
JavaScript 代码:
```javascript
var checkbox1 = document.getElementById("checkbox1");
var checkbox2 = document.getElementById("checkbox2");
var checkbox3 = document.getElementById("checkbox3");
if (checkbox1.checked) {
console.log("选项1已选中");
} else {
console.log("选项1未选中");
}
if (checkbox2.checked) {
console.log("选项2已选中");
} else {
console.log("选项2未选中");
}
if (checkbox3.checked) {
console.log("选项3已选中");
} else {
console.log("选项3未选中");
}
```
当用户点击 checkbox 时,可以使用 `checked` 属性来检查它是否被选中。如果 checkbox 被选中,则 `checked` 属性的值为 `true`,否则为 `false`。在上面的代码中,我们使用 `getElementById` 函数来获取每个 checkbox 的 DOM 元素,并使用 `checked` 属性来检查其选中状态。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)