勾选框全选巩固

原创 2018-11-14 22:59:11 171
摘要:<!DOCTYPE html> <html> <head> <title>javaScript</title> <meta charset="utf-8"> <style type="text/css">         

<!DOCTYPE html>

<html>

<head>

<title>javaScript</title>

<meta charset="utf-8">

<style type="text/css">

            .a{width:90px;height:200px;border:1px solid #000;padding:0px 10px;margin:10px auto;}

            .a div{border-bottom:1px solid #000;margin:10px auto;padding-bottom:10px;}

            .a input{margin:5px auto;}

</style>

        

</head>

<body>

    <div class="a">

    <div>

         <input type="checkbox" id="checkall" onclick="checkAll()"><label for="checkall">全选</label>

         </div>

          <input type="checkbox" name="item[]">111<br>

          <input type="checkbox" name="item[]">222<br>

          <input type="checkbox" name="item[]">333<br>

          <input type="checkbox" name="item[]">444<br>

          <input type="checkbox" name="item[]">555<br>

          <input type="checkbox" name="item[]">666<br>

         

    </div>

<script type="text/javascript">

function checkAll(){

    var checkall,item;

    checkall=document.getElementById('checkall')

    item=document.getElementsByName("item[]")

    for(var i=0;i<item.length;i++){

          if(checkall.checked){

            item[i].checked=true;

          }else{item[i].checked=false;

          }

    }


}









</script>

    




</body>  

 </html>


批改老师:灭绝师太批改时间:2018-11-15 09:15:00
老师总结:完成的不错,学习到这个阶段,就不可以完全跟着老师思路来了,可以找一些案例练手!

发布手记

热门词条