2018-07-29全选案列

2018-07-29  本文已影响0人  菜鸟亿个

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link href="css/table1.css" rel="stylesheet" type="text/css"/>
<script src="js/table1.js" type="text/javascript"></script>

</head>
<body>
<h1>员工信息列表</h1>
<table>
<tr>
<th><input type="checkbox" name="allcheckbox" onclick="javascript:checkboxAll();"/>全选</th>
<th>员工编号</th>
<th>员工名称</th>
<th>员工部门</th>
<th colspan="3">操作</th>
</tr>
<tr>
<td><input type="checkbox" name="checkbox"/></td>
<td>1001</td>
<td>张三</td>
<td>财务部</td>
<td><a href="#" onclick="javascript:deleteConfirm();">删除</a></td>
<td><a href="#" onclick="javascript:updatePrompt();">修改</a></td>
<td><a href="#" onclick="javascript:findContent()">查看</a></td>
</tr>
<tr>
<td><input type="checkbox" name="checkbox"/></td>
<td>1002</td>
<td>李四</td>
<td>产品部</td>
<td><a href="#" onclick="javascript:deleteConfirm();">删除</a></td>
<td><a href="#">修改</a></td>
<td><a href="#" onclick="javascript:updatePrompt();">查看</a></td>
</tr>
<tr>
<td><input type="checkbox" name="checkbox"/></td>
<td>1002</td>
<td>王二</td>
<td>技术部</td>
<td><a href="#" onclick="javascript:deleteConfirm();">删除</a></td>
<td><a href="#">修改</a></td>
<td><a href="#" onclick="javascript:updatePrompt();">查看</a></td>
</tr>
</table>
<script>

function checkboxAll(){
    var checkboxallArrays = document.getElementsByName("allcheckbox"); //获取name属性值为allcheckbox的html元素赋值给checkboxallArrays数组对象
    var checkall = checkboxallArrays[0]; //获取数组第一个值

    //判断全选框是否被选中,checkall.checked == true 表示选中,checkall.checked == false未选中
    if(checkall.checked == true){
         //选中处理
        var checkboxArrays = document.getElementsByName("checkbox"); //获取name属性值为checkbox的html元素赋值给checkboxArrays数组对象
        var length = checkboxArrays.length; //返回数组元素个数
        //循环选中所有选项
        for(var i = 0; i < length; i++){
            checkboxArrays[i].checked = true;
        }
    }else{
        //未选中处理
        var checkboxArrays = document.getElementsByName("checkbox");
        var length = checkboxArrays.length; //返回数组元素个数
        for(var i = 0; i < length; i++){
            checkboxArrays[i].checked = false;
        }
    }
}

</script>

</body>
</html>

上一篇 下一篇

猜你喜欢

热点阅读