zoukankan      html  css  js  c++  java
  • 多选框(全选反选)-html

    <!DOCTYPE html>
    <html>
    <head>
    <title>MyHtml.html</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <script type="text/javascript">
        window.onload = function() {
            var flag=false;
            document.getElementById("all").onclick=function(){
                flag=!flag;
                var items=document.getElementsByName("item");
                for(var x=0;x<items.length;x++){
                    items[x].checked=flag;
                }
            };
            document.getElementById("unall").onclick=function(){
                var items=document.getElementsByName("item");
                for(var x=0;x<items.length;x++){
                    items[x].checked=!items[x].checked;
                }
            };
        }
    </script>
    </head>
    
    <body>
        <div>商品列表</div>
        <input type="checkbox" name="item" value="3000" />笔记本3000元<br />
        <input type="checkbox" name="item" value="2500" />HTC手机2500<br />
        <input type="checkbox" name="item" value="8000" />苹果电脑8000<br />
        <input type="checkbox" name="item" value="1500" />IPAD1500<br />
        <input type="checkbox" name="item" value="400" />玩具汽车400<br />
        
        <input type="button" value="总金额" onclick="getSum()" />
        <input type="button" value="全选/全不选" id="all" />
        <input type="button" value="反选" id="unall" />
        <span id="sumId"></span>
    </body>
    
    </html>
  • 相关阅读:
    div居中鼠标悬浮显示下拉列表
    javascript循环
    javascript函数
    javascript时间、随机数
    javascript外部使用
    Javascript 探路
    CSS六大选择器(注释css表里不能加注释!!)
    框架链接
    Jmeter分布式测试dubbo接口2
    Jmeter分布式测试dubbo接口1
  • 原文地址:https://www.cnblogs.com/spadd/p/4192608.html
Copyright © 2011-2022 走看看