效果展示
代码
<!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>