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

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

form.submit 方法 并不会触发 form.onsubmit 事件的更多相关文章

  1. asp.net form submit 在Chrome里面看Form提交

    Chrome中查看 request  form data 在Fiddler中查看

  2. form的submit()方法不能触发onsubmit事件的解决方法，兼容各版本浏览器。

    在处理表单提交的时候遇到一个问题,通常用<input type="submit" value="提交" />按钮来提交form,再监听form的on ...

  3. form submit 的callback方法

    参考:http://hayageek.com/jquery-ajax-form-submit/ form的submit方法返回数据处理. 普通的form: $("#ajaxform" ...

  4. 文件上传时jquery.form.js中提示form.submit SCRIPT5: 拒绝访问

    利用其它控件触发file的click事件来选择文件后,使用jquery.form.js中的submit方法提交时IE报错:form.submit SCRIPT5: 拒绝访问,其它浏览器正常, < ...

  5. javascript form提交 不执行onsubmit事件解决方案

    转载自:https://www.cnblogs.com/lorgine/archive/2011/03/30/2000284.html 今天做项目过程中,需要用到javascript提交form到后台 ...

  6. 实现同时提交多个form(基础方法) 收集（转）

    方法一: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4 ...

  7. 实现同时提交多个form(基础方法) 收集

    实现同时提交多个form(基础方法) 收集 分类: 1.2-JSP 1.3-J2EE 1.1J2se 1.0-Java相关2011-12-01 20:59 1644人阅读 评论(0) 收藏 举报 bu ...

  8. <input type = "submit"> 提交方式和用js的form.submit()有什么区别？

    假设: A表单内有<input type="submit">,通过点击这个input来提交表单 B表单内没有<input type="submit&qu ...

  9. django form POST方法提交表达

    之前就着手开始尝试用django来简化web开发的流程周期,果不其然,速度还行,当然前期的产品那就相当粗糙了.举例来说,就连最基本的登录都是抄别人的,最可怕的是用GET方法提交表单,今天就尝试解决这个 ...

随机推荐

  1. php引用(&)变量引用，函数引用，对象引用和参数引用用法

    php引用(&)变量引用,函数引用,对象引用和参数引用用法   php的引用(就是在变量或者函数.对象等前面加上&符号) 在PHP 中引用的意思是:不同的名字访问同一个变量内容.与C语 ...

  2. CentOS安装rz\sz命令

    执行以下命令进行安装: yum install lrzsz 安装完成后即可操作rz和sz命令. rz:本地文件上传. sz:Linux系统文件下载到本地.

  3. sublime for mac 注册码

    https://www.jianshu.com/p/04e1b65dd2c0https://fatesinger.com/100121

  4. Python 常用内建模块(time ,datetime)

    1,在Python中,与时间处理有关的模块就包括:time,datetime以及calendar. 2,在Python中,通常有这几种方式来表示时间:1)时间戳 2)格式化的时间字符串 3)元组(st ...

  5. apue.h文件找不到的解决办法

    参考:http://blog.csdn.net/nihaotoyou/article/details/16827675 1.首先到该书的官网下载源代码:http://www.apuebook.com/ ...

  6. 如何使用Photoshop（PS）将图片的底色变为透明

    很多时候需要将一张图片的底色变得透明.本文描述了使用PS将图片的一部分变得透明的方法.本例将一段艺术字的背景去掉,将背景透明的文字单独保存成图片,这样以后将这段文字粘贴到其他素材上的时候,就不用担心它 ...

  7. mysql乐观锁和悲观锁

    在多用户环境中,在同一时间可能会有多个用户更新相同的记录,这会产生冲突.这就是著名的并发性问题. 悲观锁:假定会发生并发冲突,屏蔽一切可能违反数据完整性的操作. 乐观锁:假设不会发生并发冲突,只在提交 ...

  8. 两款 REST 测试工具

    用CURL命令行测试REST API 无疑是低效率的,这里把最近使用的两款 Chrome 插件总结下 POSTMAN 简单易用 REST Console 功能强大 使用的话用POSTMAN就够用了,但 ...

  9. PAT007 六度空间

    “六度空间”理论又称作“六度分隔(Six Degrees of Separation)”理论.这个理论可以通俗地阐述为:“你和任何一个陌生人之间所间隔的人不会超过六个,也就是说,最多通过五个人你就能够 ...

  10. 描述J2EE框架的多层结构，并简要说明各层的作用。

    描述J2EE框架的多层结构,并简要说明各层的作用. 解答: 1) Presentation layer(表示层) a. 表示逻辑(生成界面代码) b. 接收请求 c. 处理业务层抛出的异常 d. 负责 ...