首页 > 其他 > 详细

9.27dom再练习

时间:2017-09-27 20:05:17      阅读:203      评论:0      收藏:0      [点我收藏+]
    <body>
        <table>
            <tr>
                <td>

                    <input type="checkbox" id="check_all" />
                    <label for="check_all">全选</label>
                    <input type="checkbox" id="reverse" />
                    <label for="reverse">反选</label>
                </td>
            </tr>
            <tr>
                <td>
                    <input type="checkbox" class="items" />
                </td>
            </tr>
            <tr>
                <td>
                    <input type="checkbox" class="items" />
                </td>
            </tr>
            <tr>
                <td>
                    <input type="checkbox" class="items" />
                </td>
            </tr>
            <tr>
                <td>
                    <input type="checkbox" class="items" />
                </td>
            </tr>
            <tr>
                <td>
                    <input type="checkbox" class="items" />
                </td>
            </tr>
            <tr>
                <td>
                    <input type="checkbox" class="items" />
                </td>
            </tr>
        </table>
    </body>

</html>
<script>
    var check = document.getElementById("check_all");
    var reverse = document.getElementById("reverse");

    var items = document.getElementsByClassName("items");

    check.onchange = function() {
        if(check.checked) {
            for(var x in items) {
                items[x].checked = true;
            }
        } else {
            for(var x in items) {
                items[x].checked = false;
            }
        }
    }
    for(var z in items) {
        items[z].onchange = function() {
            if(!this.checked) {
              alert(this.checked);
                check.checked = false;
            }else{
                var status = 0;
                for(var y in items){
                    if(items[y].checked == false){
                        status = 1;
                        alert(y);
                    }
                }
                if(status == 0){
                    check.checked = true;
                }
            }
        }
    }
    
    reverse.onclick = function(){
        for(var x in items){
//            if(items[x].checked){
//                items[x].checked = false;
//            }else{
//                items[x].checked = true;
//            }
            items[x].checked = items[x].checked?false:true;
        }
    }
</script>
昨天的作业 全选反选

 

9.27dom再练习

原文:http://www.cnblogs.com/sistrong-5880558/p/7603461.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!