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

  • 相关阅读:
    【LeetCode】3Sum Closest 解题报告
    LOJ#6277. 数列分块入门 1
    洛谷P1919 【模板】A*B Problem升级版(FFT快速傅里叶)
    LOJ #108. 多项式乘法
    快速傅里叶变换(FFT)详解
    HDU 5536 Chip Factory
    洛谷P4093 [HEOI2016/TJOI2016]序列
    洛谷P2633 Count on a tree
    HDU 4825 Xor Sum
    洛谷T21778 过年
  • 原文地址:https://www.cnblogs.com/lichihua/p/10241531.html
Copyright © 2011-2022 走看看