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 倒是正常的,所以这个特例需要注意下,如果有人发现原因了,感谢告知呀 !
form.submit 方法 并不会触发 form.onsubmit 事件的更多相关文章
- asp.net form submit 在Chrome里面看Form提交
Chrome中查看 request form data 在Fiddler中查看
- form的submit()方法不能触发onsubmit事件的解决方法,兼容各版本浏览器。
在处理表单提交的时候遇到一个问题,通常用<input type="submit" value="提交" />按钮来提交form,再监听form的on ...
- form submit 的callback方法
参考:http://hayageek.com/jquery-ajax-form-submit/ form的submit方法返回数据处理. 普通的form: $("#ajaxform" ...
- 文件上传时jquery.form.js中提示form.submit SCRIPT5: 拒绝访问
利用其它控件触发file的click事件来选择文件后,使用jquery.form.js中的submit方法提交时IE报错:form.submit SCRIPT5: 拒绝访问,其它浏览器正常, < ...
- javascript form提交 不执行onsubmit事件解决方案
转载自:https://www.cnblogs.com/lorgine/archive/2011/03/30/2000284.html 今天做项目过程中,需要用到javascript提交form到后台 ...
- 实现同时提交多个form(基础方法) 收集(转)
方法一: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4 ...
- 实现同时提交多个form(基础方法) 收集
实现同时提交多个form(基础方法) 收集 分类: 1.2-JSP 1.3-J2EE 1.1J2se 1.0-Java相关2011-12-01 20:59 1644人阅读 评论(0) 收藏 举报 bu ...
- <input type = "submit"> 提交方式和用js的form.submit()有什么区别?
假设: A表单内有<input type="submit">,通过点击这个input来提交表单 B表单内没有<input type="submit&qu ...
- django form POST方法提交表达
之前就着手开始尝试用django来简化web开发的流程周期,果不其然,速度还行,当然前期的产品那就相当粗糙了.举例来说,就连最基本的登录都是抄别人的,最可怕的是用GET方法提交表单,今天就尝试解决这个 ...
随机推荐
- android获取系统应用大小的方法
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-s ...
- CI框架源代码阅读笔记7 配置管理组件 Config.php
原文见这里:http://www.cnblogs.com/ohmygirl/p/CIRead-7.html 一个灵活可控的应用程序中,必定会存在大量的可控參数(我们称为配置),比如在CI的主配置文件里 ...
- chrome 脚本学习
# 编写可复用的代码段(snippet)教程 https://jingyan.baidu.com/article/67508eb423d2929ccb1ce45b.html # chrome 脚本开发 ...
- c#, extract number from string
using System.Text.RegularExpressions; string numberStr = Regex.Match (str, "[0-9]").Value; ...
- WebSocket遇到的一些问题
一 .Nginx配置websocket 为了解决Nginx转发不能进行websocket通信问题 将nginx配置文件添加如下内容: map $http_upgrade $connection ...
- C#.NET中使用BackgroundWorker在模态对话框中显示进度条
这里是一个示例,其中展示了如何使用Backgroundworker对象在模态对话框中显示后台操作的实时进度条. 首先是主窗体代码: using System; using System.Collect ...
- boost thread
#include <cassert> #include <iostream> #include <boost/ref.hpp> #include <boost ...
- C#元祖Tuple的事例
数组合并了同样类型的对象.而元祖合并了不同类型的对象.元祖起源于函数编程语言(F#) NET Framework定义了8个泛型Tuple(自NET4.0)和一个静态的Tuple类,他们作用元祖的工厂, ...
- Windows7 64位安装最新版本号MySQLserver
Windows7 64位安装最新版本号MySQLserver 最近,一直在研究MySQL数据库.常常改动配置文件.导致MySQL数据库无法使用.不得不重复重装MySQL数据库.下面是在Windows7 ...
- 李洪强和你一起学习前端之(1)Html基础
1 快捷键的认识(虽然我用的是MAC,但是这里以windows快捷键来讲,但是MAC电脑可以把Ctrl换成command试试) Ctrl + c 复制 Ctrl + v 粘贴 Ctrl + a ...