zoukankan      html  css  js  c++  java
  • Jquery checkbox全选,反选,全不选实例

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
    
        <script type="text/javascript" src="</script'>http://www.bannei.com/site_media/js/jquery-1.4.2.min.js"></script>
    
        <script type="text/javascript">
            $(function() {
                //全选
                $("#checkAll").click(function() {
                    $("[name='items']:checkbox").attr("checked", true);
    
    
                });
                //反选
                $("#checkOpp").click(function() {
                    $("[name='items']:checkbox").each(function() {
    
                        $(this).attr("checked", !$(this).attr("checked"));
                    });
                });
                //全不选
                $("#checkNO").click(function() { $("[name='items']:checkbox").attr("checked", false); });
    
    
                $("#SubmitID").click(function() {
                    var Str = "你选中的是:\n\r";
                    $("[name='items']:checkbox:checked").each(function() {
                        Str += $(this).val() + "\n\r";
                    });
                    alert(Str);
                });
    
    
            });
        </script>
    
    </head>
    <body>
        <form>
        <fieldset>
            <legend>你爱好的运动是?</legend>
            <div id="DIV1">
                <input type="checkbox" name="items" value="足球" />足球
                <input type="checkbox" name="items" value="篮球" />篮球
                <input type="checkbox" name="items" value="乒乓球" />兵乓球
                <input type="checkbox" name="items" value="跑步" />跑步
                <input type="checkbox" name="items" value="踢毽子" />踢毽子
                <input type="checkbox" name="items" value="俯卧撑" />俯卧撑
                <input type="checkbox" name="items" value="羽毛球" />羽毛球
            </div>
            <br>
            <input type="button" value="全选" id="checkAll" />
            <input type="button" value="反选" id="checkOpp" />
            <input type="button" value="全不选" id="checkNO" />
            <input type="button" value="取值" id="SubmitID" />
        </fieldset>
        </form>
    </body>
    </html>
    

      

  • 相关阅读:
    Retrofit源码分析
    Android异步消息机制
    崩溃bug日志总结3
    单例模式
    总结(第一段)
    mysql日期类型比较
    mysql记录(一)
    JSONObject/JSONArray的区别
    java 正则表达式(Pattern ,Matcher)的使用
    javaweb开发中的权限管理的方法
  • 原文地址:https://www.cnblogs.com/chu888chu888/p/2320179.html
Copyright © 2011-2022 走看看