JavaScript实现获得表格中被选中的复选框

最新推荐文章于 2022-10-30 20:54:47 发布

二木成林

最新推荐文章于 2022-10-30 20:54:47 发布

阅读量1.6k

点赞数

分类专栏： # JavaScript 文章标签： JavaScript

本文链接：https://blog.csdn.net/cnds123321/article/details/102632361

版权

JavaScript 专栏收录该内容

24 篇文章 0 订阅

订阅专栏

效果展示

代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>
		<table border="1" cellspacing="0" cellpadding="0">
			<tr>
				<th><input type="checkbox" /></th>
				<th>序号</th>
				<th>姓名</th>
				<th>性别</th>
				<th>年龄</th>
			</tr>
			<tr>
				<td><input type="checkbox" class="selected_item" value="1"></td>
				<td>1</td>
				<td>张三</td>
				<td>男</td>
				<td>15</td>
			</tr>
			<tr>
				<td><input type="checkbox" class="selected_item" value="2"></td>
				<td>2</td>
				<td>李四</td>
				<td>女</td>
				<td>25</td>
			</tr>
			<tr>
				<td><input type="checkbox" class="selected_item" value="3"></td>
				<td>3</td>
				<td>王五</td>
				<td>男</td>
				<td>19</td>
			</tr>
		</table>

		<script type="text/javascript">
			// 获取选中的复选框项，保存为一个数组
			function getCheckedCheckbox(checkboxClassName) {
				var array = new Array();
				var j = 0;
				var selectedItems = document.getElementsByClassName(checkboxClassName);
				for (var i = 0; i < selectedItems.length; i++) {
					if (selectedItems[i].checked == true) {
						array[j] = selectedItems[i];
						j++;
					}
				}
				return array;
			}
			// 输出选中
			var items = getCheckedCheckbox("selected_item");
			for (var i = 0; i < items.length; i++) {
				console.log(items[i].value);
			}
		</script>
	</body>
</html>

二木成林

关注

0
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
JavaScript实现获得表格中被选中的复选框

效果展示代码<!DOCTYPE html><html> <head> <meta charset="utf-8"> </head> <body> <table border="1" cellspacing="0" cellpadding="0"> <tr> &...
复制链接

扫一扫

专栏目录