亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

JavaScrip-—t復(fù)選框

原創(chuàng) 2019-01-21 17:28:33 238
摘要:<!-- <!DOCTYPE html><style>    #x{        width: 100px;        height: 100px;        background-color:red;  &n

<!-- <!DOCTYPE html>

<style>

    #x{

        width: 100px;

        height: 100px;

        background-color:red;

    }

</style>

<html>

    <head>

        <meta charset="utf-8">

    </head>

    <body>

        <div id="x">

            

        </div>

        <button onclick="a()">變高</button>

        <button onclick="b()">變寬</button>

        <button onclick="c()">變色</button>

        <button onclick="d()">重置</button>

        <button onclick="e()">隱藏</button>

        <button onclick="f()">顯示</button>

    </body>

</html>

<script type="text/javascript">

    var x = document.getElementById('x');

    function a(){

        x.style.height = "200px";

    }

    function b(){

        x.style.width = "200px";

    }

    function c(){

        x.style.backgroundColor = "pink";

    }

    function d(){

        x.style.height = "100px";

        x.style.width = "100px";

        x.style.backgroundColor = "red";

    }

    function e(){

        x.style.visibility = "hidden";

    }

    function f(){

        x.style.visibility = "visible";

    }

</script> -->

    <style type="text/css">

        

        .box{width: 120px;height: 250px;border: 1px solid #000;border-radius: 5px;padding: 5px 10px;margin: 20px auto;}

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

        .box input{margin: 8px;}

    </style>

<html>

    <head>

        <meta charset="utf-8">

    </head>

    <body>

<div>

    <div>

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

    </div>

    <input type="checkbox" name="item[]">選項(xiàng)1<br>

    <input type="checkbox" name="item[]">選項(xiàng)2<br>

    <input type="checkbox" name="item[]">選項(xiàng)3<br>

    <input type="checkbox" name="item[]">選項(xiàng)4<br>

    <input type="checkbox" name="item[]">選項(xiàng)5<br>

    <input type="checkbox" name="item[]">選項(xiàng)6<br>

</div>

    </body>

</html>

<script type="text/javascript">

        function checkAll(){

            var checkall = document.getElementById('checkall');

            var 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>


批改老師:天蓬老師批改時(shí)間:2019-01-21 17:54:00
老師總結(jié):全選的重點(diǎn)在于復(fù)選框的名稱, 因?yàn)樗麄兪且唤M元素, 要注意, 還有, 提交作業(yè) 用點(diǎn), 不要這樣把代碼一復(fù)制了事, 應(yīng)該寫上注釋, 附上圖, 并且將代碼放在代碼塊中高亮提交, 作業(yè)可以看出一個(gè)人做事的態(tài)度, 希望下次看到你的變化

發(fā)佈手記

熱門詞條