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

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. DataTable转换成匿名类的List类型

    DataTable转换成匿名类的List类型   因为匿名类是不能够 Activator.CreateInstance进行反射实例化的 /// <summary> /// 匿名类的转换方式 ...

  2. python selenium --frame

    本节知识点: 多层框架或窗口的定位: switch_to_frame() switch_to_window() 智能等待: implicitly_wait() 对于一个现代的web应用,经常会出现框架 ...

  3. python代码 构建验证码

    1.python代码编写 (随机验证码): #coding: utf-8 import Image, ImageDraw, ImageFont, ImageFilter import string, ...

  4. PHP中获取当前页面的完整URL & php $_SERVER中的SERVER_NAME 和HTTP_HOST的区别

    #测试网址:     http://localhost/blog/testurl.php?id=5 //获取域名或主机地址 echo $_SERVER['HTTP_HOST']."<b ...

  5. 使用PHP创建一个REST API(Create a REST API with PHP)

    译者前言: 首先这是一篇国外的英文文章,非常系统.详尽的介绍了如何使用PHP创建REST API,国内这方面的资料非常非常的有限,而且基本没有可操作性.这篇文章写的非常好,只要对PHP稍有了解的程序员 ...

  6. zookeeper(五):Zookeeper中的Access Control(ACL)

    概述 传统的文件系统中,ACL分为两个维度,一个是属组,一个是权限,子目录/文件默认继承父目录的ACL.而在Zookeeper中,node的ACL是没有继承关系的,是独立控制的. Zookeeper的 ...

  7. Atitit.用户权限服务 登录退出功能

    Atitit.用户权限服务 登录退出功能 参数说明 /com.attilax/user/loginOut.jsp?url="+url Utype=mer 作者::  ★(attilax)&g ...

  8. vncviewer鼠标不同步问题

    sh-4.1# virsh edit win7 把下面的参数: <input type='mouse' bus='ps2'/> 改成: <input type='tablet' bu ...

  9. java 发送带Basic Auth认证的http post请求实例代码

    构造http header private static final String URL = "url"; private static final String APP_KEY ...

  10. JAVA连接各种数据库详解

    Java数据库连接(JDBC)由一组用 Java 编程语言编写的类和接口组成.JDBC 为工具/数据库开发人员提供了一个标准的 API,使他们能够用纯Java API 来编写数据库应用程序.然而各个开 ...