js表单提交和submit提交的区别实例分析


Posted in Javascript onDecember 10, 2015

本文实例分析了js表单提交和submit提交的区别。分享给大家供大家参考,具体如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<script>
function test()
{
  document.getElementById("myform").submit();  
  alert(11);
}
</script>
<form name="myfrom" id="myform" method="get" action="b.php">
<input type="text" name="pwd" value="" />
<input type="submit" name="sub" value="111" />
<input type="button" name="btn" value="btn" onclick="test()" />
</form>
</body>
</html>

注意:get方式提交表单时 action里面不能用url传值, post则可以这样传

js提交和submit按钮提交的区别:
   
1. js提交表单时不会带上 submit 按钮的值(因为没有被单击) 所有浏览器

2. input 回车提交 w3c浏览器会带上submit按钮的值,ie6则不会带

解决办法:

增加一个hidden域,用这个来判断,无论用哪种方式提交都会有值

submit按钮上绑定提交事件:

即:<input type="submit" name="btn" value="btn" onclick="test()" />
都会带上submit的值, 用js提交都检测不到onsubmit状态
w3c: 提交一次
ie6: 分两次提交,先js在form提交

解决办法:

如果按钮为submit则 检测时用onsubmit事件检测

如果按钮为button,则检测通过后在触发submit事件

一定不要用js提交表单,然后又用onsubmit去检测

单纯的用js提交表单, alert, ff下阻塞表单的提交,而其他浏览

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
JavaScript高级程序设计 事件学习笔记
Sep 10 Javascript
JS打开层/关闭层/移动层动画效果的实例代码
May 11 Javascript
JS定时关闭窗口的实例
May 22 Javascript
ANGULARJS中使用JQUERY分页控件
Sep 16 Javascript
jQuery代码性能优化的10种方法
Jun 21 Javascript
jquery 动态合并单元格的实现方法
Aug 26 Javascript
js实现简单的碰壁反弹效果
Aug 30 Javascript
JavaScript仿网易选项卡制作代码
Oct 06 Javascript
很棒的vue弹窗组件
May 24 Javascript
vue+vux实现移动端文件上传样式
Jul 28 Javascript
基于对象合并功能的实现示例
Oct 10 Javascript
js实现贪吃蛇游戏(简易版)
Sep 29 Javascript
浅谈javascript中onbeforeunload与onunload事件
Dec 10 #Javascript
详解JavaScript基于面向对象之创建对象(2)
Dec 10 #Javascript
JS提交form表单实例分析
Dec 10 #Javascript
详解JavaScript基于面向对象之创建对象(1)
Dec 10 #Javascript
AngularJs实现ng1.3+表单验证
Dec 10 #Javascript
理解AngularJs指令
Dec 10 #Javascript
详解AngularJS实现表单验证
Dec 10 #Javascript
You might like
php中读写文件与读写数据库的效率比较分享
2013/10/19 PHP
通过Email发送PHP错误的方法
2015/07/20 PHP
PHP中实现中文字串截取无乱码的解决方法
2018/05/29 PHP
一个对于js this关键字的问题
2007/01/09 Javascript
jQuery 1.0.4 - New Wave Javascript(js源文件)
2007/01/15 Javascript
range 标准化之获取
2011/08/28 Javascript
SeaJS入门教程系列之使用SeaJS(二)
2014/03/03 Javascript
JavaScript学习笔记之内置对象
2015/01/22 Javascript
2种jQuery 实现刮刮卡效果
2015/02/01 Javascript
JS+CSS实现实用的单击输入框弹出选择框的方法
2015/02/28 Javascript
Angular中的Promise对象($q介绍)
2015/03/03 Javascript
学习JavaScript设计模式(单例模式)
2015/11/26 Javascript
AngularJS Controller作用域
2017/01/09 Javascript
最常见和最有用的字符串相关的方法详解
2017/02/06 Javascript
jQuery中.attr()和.data()的区别分析
2017/09/03 jQuery
bootstrap实现二级下拉菜单效果
2017/11/23 Javascript
Js经典案例的实例代码
2018/05/10 Javascript
vue实现点击选中,其他的不选中方法
2018/09/05 Javascript
javascript将非数值转换为数值
2018/09/13 Javascript
Vue绑定内联样式问题
2018/10/17 Javascript
vue router 传参获取不到的解决方式
2019/11/13 Javascript
[02:24]DOTA2亚洲邀请赛 NAVI战队出场宣传片
2015/02/07 DOTA
Python天气预报采集器实现代码(网页爬虫)
2012/10/07 Python
django mysql数据库及图片上传接口详解
2019/07/18 Python
Pytorch实现基于CharRNN的文本分类与生成示例
2020/01/08 Python
Python利用pip安装tar.gz格式的离线资源包
2020/09/14 Python
利用python查看数组中的所有元素是否相同
2021/01/08 Python
伦敦剧院门票:From The Box Office
2018/06/30 全球购物
Lululemon加拿大官网:加拿大知名体育服装零售商
2019/04/12 全球购物
香港零食网购:上仓胃子
2020/06/08 全球购物
初三学习计划书范文
2014/04/30 职场文书
党员创先争优活动总结
2014/05/04 职场文书
乒乓球兴趣小组活动总结
2014/07/08 职场文书
小学课外阅读总结
2014/07/09 职场文书
批评与自我批评发言稿
2014/10/15 职场文书
python分分钟绘制精美地图海报
2022/02/15 Python