• 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 倒是正常的,所以这个特例需要注意下,如果有人发现原因了,感谢告知呀 !

  • 相关阅读:
    MySQL 8.0 复制延迟观测新方式
    同一台交换机不能相互访问?
    这地方怪怪的
    虾米事情都要在5月30日以前完成
    我搬新家了
    痛恨财务的……
    关于Android Studio Arctic Fox版本找不到Database Inspection这件事
    部署SpringBoot项目到腾讯云或其他服务器
    Object.keys方法之详解
    博客园新随笔 添加锚点
  • 原文地址:https://www.cnblogs.com/xianshenglu/p/8011447.html
Copyright © 2020-2023  润新知