zoukankan      html  css  js  c++  java
  • jQuery 复选框全选反选

     <script type="text/javascript">
    $(
    function(){
    //全选
    $("#CheckedAll").click(function(){
    $(
    '[name=items]:checkbox').attr("checked", this.checked );
    });
    $(
    '[name=items]:checkbox').click(function(){
    //定义一个临时变量,避免重复使用同一个选择器选择页面中的元素,提升程序效率。
    var $tmp=$('[name=items]:checkbox');
    //用filter方法筛选出选中的复选框。并直接给CheckedAll赋值。
    $('#CheckedAll').attr('checked', $tmp.length==$tmp.filter(':checked').length);
    });

    //输出值
    $("#send").click(function(){
    var str="你选中的是:\r\n";
    $(
    '[name=items]:checkbox:checked').each(function(){
    str
    +=$(this).val()+"\r\n";
    })
    alert(str);
    });
    });
    </script>
    </head>

    <body>
    <form method="post" action="">
    <b>你爱好的运动是?</b><br/>
    <input type="checkbox" id="CheckedAll" />全选/全不选<br/>
    <input type="checkbox" name="items" value="足球"/>足球
    <input type="checkbox" name="items" value="篮球"/>篮球
    <input type="checkbox" name="items" value="羽毛球"/>羽毛球
    <input type="checkbox" name="items" value="乒乓球"/>乒乓球<br/>
    <input type="button" id="send" value="提 交"/>
    </form>

    </body>

  • 相关阅读:
    在“安装”阶段发生异常。 System.Security.SecurityException: 未找到源,但未能
    [转]C# 实现Jwt bearer Authentication
    json序列化数据超出最大值(maxJsonLength)
    設計之家-教程
    Python Dom 的介绍和使用day1
    Python CSS day2
    回顾
    Python CSS day1
    Python HTML day2
    Python HTML day1
  • 原文地址:https://www.cnblogs.com/linjiqin/p/2177885.html
Copyright © 2011-2022 走看看