zoukankan      html  css  js  c++  java
  • form.submit 方法 并不会触发 form.onsubmit 事件

    做表单的时候发现一个奇怪的地方,总结下:

    form.submit 方法 并不会触发 form.onsubmit 事件,看代码:

    <body>
        <div class="container">
            <form action="http://route.showapi.com/213-1" method="POST">
                <input type="text" value="ssss">
                <button type="submit">提交</button>
            </form>
        </div>
        <script>
            var form=document.forms[0];
            var btn=form.getElementsByTagName('button')[0];
            form.onsubmit=function(event){
                var e = event||window.event;
                alert(e);
            };
            form.submit();
        </script>
    </body>

    如题,一打开网页,并没有 alert() ,而是直接提交表单了,也就是说,form.submit 方法 并不会触发 form.onsubmit 事件 ,FF 和 chrome 测试都一样,解决办法:

    把 form.submit(); 改成提交按钮的 click 事件,上题就是把最后一句代码改成:

    btn.click();

    可能有的人不想这么做,会想把 form.submit() 改成 form.onsubmit() ,但是这个逻辑就错了,不信你试试???

    解析:fomr.submit() 是在调用 form 的 submit 方法(默认的方法),而 form.onsubmit() 是在调用 form 的 onsubmit 方法(你在前面指定的),这个时候就获取不到 event 对象了,获取的 undefined

    但是如果不是 submit 事件,换成 click 倒是正常的,所以这个特例需要注意下,如果有人发现原因了,感谢告知呀 !

  • 相关阅读:
    119. Pascal's Triangle II
    118. Pascal's Triangle
    112. Path Sum
    111. Minimum Depth of Binary Tree
    110. Balanced Binary Tree
    108. Convert Sorted Array to Binary Search Tree
    88. Merge Sorted Array
    83. Remove Duplicates from Sorted List
    70. Climbing Stairs
    陌陌面试经历
  • 原文地址:https://www.cnblogs.com/xianshenglu/p/8011447.html
Copyright © 2011-2022 走看看