zoukankan      html  css  js  c++  java
  • e.target 方法判断多个radio 是否选择

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>12313</title>
    </head>
    <body>
    <form action="" method="" id="form1">
        <p>
            <input type="radio" value="1" name="man"/><input type="radio" value="2" name="man" /><input type="radio" value="3" name="man" />
            <input type="hidden" value="false" id="hidden0"/>
        </p>
        <p>
            <input type="radio" value="1" name="sex"/><input type="radio" value="2" name="sex" /><input type="radio" value="3" name="sex" />
            <input type="hidden" value="false" id="hidden1"/>
        </p>
        <input type="submit" id="submit"/>
    </form>
     
    <script type="text/javascript">
    window.onload = function(){
        var oForm = getId("form1");
        var hidden0 = getId("hidden0");
        var hidden1 = getId("hidden1");
        var submit = getId("submit");
        oForm.onclick = function(e){
            if(e){
                switch(e.target.name){
                    case "man":
                        hidden0.value = "true";
                        break;
                    case "sex":
                        hidden1.value = "true";
                        break;
                }
                e.stopPropagation();
            }else{
                switch(event.srcElement.name){
                    case "man":
                        hidden0.value = "true";
                        break;
                    case "sex":
                        hidden1.value = "true";
                        break;
                }
                event.cancelBubble = true;
            }
        }
        submit.onclick = function(e){
            var oEvent = e || event;
            if(hidden0.value != "true" && hidden1.value != "true"){
                alert("未选择");
                if(oEvent.preventDefault){
                    oEvent.preventDefault();
                }else{
                    oEvent.returnValue = false;
                }
            }else{
                alert("已经选择");
            }
            if(oEvent.stopPropagation){
                oEvent.stopPropagation();

            }else{
                oEvent.cancelBubble = true;
            }

        }
        document.onclick = function(){
            alert("b")
        }

    }
    function getId(id){
        return document.getElementById(id);
    }
    </script>
    </body>
    </html>

  • 相关阅读:
    CEPH篇 目录
    kubernetes篇 容器用户权限控制
    深度学习篇-如何理解置信区间
    Mac软件安装篇 for Mac
    JAVA进阶篇 内存模型
    负载均衡篇 不同层次的负载均衡(2/3/4/7)
    NETTY篇 一篇文章看懂NETTY
    base64加密后无法解密
    Spring-Cloud-Gateway 从升级到放弃
    spring gateway 截取response 长度缺失
  • 原文地址:https://www.cnblogs.com/xiuciedward/p/3186163.html
Copyright © 2011-2022 走看看