zoukankan      html  css  js  c++  java
  • 表单中有关于爱好的多选框, 篮球,足球,游泳,跑步, 再有一个多选框,代表全选

    家庭作业

    篮球 足球 游泳 跑步

    <!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 runat="server">
        <title>家庭作业</title>
        <script src="jquery-3.1.1.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(function () {
                //全选
                $("#btnCheckall").bind("click", function () {
                    $("[name = chkItem]:checkbox").attr("checked", true);
                });
                //全不选
                $("#btnCheckNone").bind("click", function () {
                    $("[name = chkItem]:checkbox").attr("checked", false);
                });
                //反选
                $("#btnCheckReverse").bind("click", function () {
                    $("[name = chkItem]:checkbox").each(function () {
                        $(this).attr("checked", !$(this).attr("checked"));
                    });
                });
                // 提交
                $("#btnSubmit").bind("click", function () {
                    var result = new Array();
                    $("[name = chkItem]:checkbox").each(function () {
                        if ($(this).is(":checked")) {
                            result.push($(this).attr("value"));
                        }
                    });
    
                    alert(result.join(","));
                });
            });
    
    
        </script>
    
    
    </head>
    <body>
    <div>
        <input name="chkItem" type="checkbox" value="篮球"/>篮球
        <input name="chkItem" type="checkbox" value="足球"/>足球
        <input name="chkItem" type="checkbox" value="游泳"/>游泳
        <input name="chkItem" type="checkbox" value="跑步"/>跑步
        <br/>
        <br/>
    </div>
    <div>
        <input id="btnCheckall" type="button" value="全选"/>
        <input id="btnCheckNone" type="button" value="全不选"/>
        <input id="btnCheckReverse" type="button" value="反选"/>
        <input id="btnSubmit" type="button" value="提交"/>
    </div>
    </body>
    </html>
    

      不明白啊   不明白啊   不明白

  • 相关阅读:
    Redis分布式锁解决抢购问题
    Linux查看进程,端口,服务路径等
    执行jar包,输出信息到文件
    查看linux服务器信息
    IDEA将项目打包为指定class文件的jar
    RSA加密-解密以及解决超长内容加密失败解决
    win10 Snipaste 截图软件
    线程池参数详解
    本地连接Linux工具
    python安装
  • 原文地址:https://www.cnblogs.com/john568300/p/6422168.html
Copyright © 2011-2022 走看看