纯JavaScript操作复选框元素及属性

最新推荐文章于 2023-10-20 16:21:07 发布

bingliang514csdn

最新推荐文章于 2023-10-20 16:21:07 发布

阅读量372

点赞数

CC 4.0 BY-SA版权

分类专栏： jquery 文章标签： javascript 前端

本文链接：https://blog.youkuaiyun.com/bingliang514csdn/article/details/127454873

jquery 专栏收录该内容

10 篇文章

订阅专栏

本文介绍了如何使用JavaScript获取HTML中name属性为'chbIdx01'的复选框的选中状态，并显示选中项的值。通过document.getElementsByName()获取复选框数组，遍历判断每个复选框是否被选中。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

根据元素名称获取对象
复选框是否选中
选中复选框的值

<body>
	<input type="checkbox" name="chbIdx01" value="数学" />数学
	<input type="checkbox" name="chbIdx01" value="语文" />语文
	<input type="button" id="btnIdx_01" value="单击1" onclick="clickCheckBox()" />
</body>

<script type="text/javascript">
function clickCheckBox() {
	// 根据document文档元素名称获取到checkbox元素数组
	var chboxs = document.getElementsByName("chbIdx01");

	for(let i = 0; i < chboxs.length ; i++) {
	// 是否选中复选框 true
	if(chboxs[i].checked) {
		var chboxChedVal = chboxs[i].value;
		alert("选中复选框值:"+ chboxChedVal);
	} else {
		alert("未选中i:"+ i);
	  }
	}
}
</script>