zoukankan      html  css  js  c++  java
  • form

    1、有没有action属性都会自动提交

    <form  method="post">
        <input type="text" name="age" value="">
        <input type="submit" value="确认">
    </form>

    2、点击type为botton的input不会提交表单,但是如果在浏览器将type值改为submit 则会提交

    <form action="'  method="post">
        <input type="text" name="age" value="">
        <input type="button" value="确认">
    </form>

    3.在onsubmit="check()" 这种必须加上retrun 函数里retrun false;才会阻止表单自动提交

    <form  method="post" onsubmit="return check()">
        <input type="text" name="age" value="">
        <input type="submit" value="确认">
    </form>
    <script type="text/javascript"> 
        function check(){
            return false;
        }
    </script>

    正确姿势

    <body>
        <form  method="post">
            <input type="text" name="age" value="">
            <input type="submit" value="确认">
        </form>
        <script type="text/javascript"> 
            $("form").submit(function () {
                if(/^[0-9]*$/.test('123')){ 
                    return true;
                }
                return false;//必须加这个
            });
        </script>
    </body>

    其他情况

    无效

    <body>
        <form  method="post" onsubmit="return check()">
            <input type="text" name="age" value="">
            <input type="submit" value="确认">
        </form>
        <script type="text/javascript"> 
            $('form').submit(function(){
                return false;
            })//加上这个则函数里的return true 无效,即便是匹配上了也不能让form提交
            function check(){
                
                if(/^[0-9]*$/.test('123')){    
                    
                    return true;
                }else{        
                    return false;
                    
                }
            }
        </script>
    </body>

    上面的情况变有效

    <body>
        <form  method="post" onsubmit="check()">
            <input type="text" name="age" value="">
            <input type="submit" value="确认">
        </form>
        <script type="text/javascript"> 
            $('form').submit(function(){
                return false;
            })
            function check(){
                
                if(/^[0-9]*$/.test('123')){    
                    
                     $("form").unbind();//这个才有效
                }
            }
        </script>
    </body>
    
    
    
    <body>
        <form  method="post" onsubmit="return check()">
            <input type="text" name="age" value="">
            <input type="submit" value="确认">
        </form>
        <script type="text/javascript"> 
            $('form').submit(function(){
                return false;
            })
            function check(){
                
                if(/^[0-9]*$/.test('123')){    
                    
                     $("form").unbind();//这个才有效
                }
            }
        </script>
    </body>

    无效

    <body>
        <form  method="post">
            <input type="text" name="age" value="">
            <input type="submit" value="确认">
            <button>提交</button>
        </form>
        <script type="text/javascript"> 
            $('form').submit(function(){return false;})
    
            $("input[type='submit']").click(function(){
                $('form').submit();
            })
    
            $("button").click(function(){
                $('form').submit();
            })        
            
        </script>
    </body>

    有效:

    <body>
        <form  method="post">
            <input type="text" name="age" value="">
            <input type="submit" value="确认">
            <button>提交</button>
        </form>
        <script type="text/javascript"> 
            $('form').submit(function(){return false;})
    
            $("input[type='submit']").click(function(){
                $("form").unbind();//这个才有效
            })
    
            $("button").click(function(){
                $("form").unbind();//这个才有效
            })        
            
        </script>
    </body>

    另一种场景点击a

  • 相关阅读:
    C++ 课程设计——电梯调度系统
    PAT 1006 Sign In and Sign Out 查找元素
    PAT 1005 Spell It Right 字符串处理
    C++ 词汇表
    四六级分数竟是这样算出来的!交白卷都不会得零分 (转)
    以太坊智能合约部署
    如何设计一个通证经济体系?(转载)
    以太坊上那些暴力“利”的应用(转载)
    geth搭建以太坊私链及常用操作
    ubuntu18.04 安装 QQ
  • 原文地址:https://www.cnblogs.com/lichihua/p/10241531.html
Copyright © 2011-2022 走看看