在javaScript中关于submit和button的区别介绍


Posted in Javascript onOctober 20, 2013

submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了。
如果表单在点击提交按钮后需要用JS进行处理(包括输入验证)后再提交的话,通常都必须把submit改成button,即取消其自动提交的行为,否则,将会造成提交两次的效果,对于动态网页来说,也就是对数据库操作两次。或者在使用submit时验证时加return true或false。
submit和button,二者都以按钮的形式展现,看起来都是按钮,所不同的是type属性和处发响应的事件上,submit会提交表单,button不会提交表单. 两者主要区别在于:
submit默认为form提交,可以提交表单(form).
button则响应用户自定义的事件,如果不指定onclick等事件处理函数,它是不做任何事情.当然,button也可以完成表单提交的工作. INPUT type=submit 即发送表单,按回车提交表单

INPUT type=button 就是单纯的按钮功能,提交的是innerTEXT

===============submit 和 button的详细对比===================================
submit:特殊的button,会自动将表单的数据提交,onClick方法不加return 会自动提交,并不会起到约束的作用,
所以,使用submit时需要验证请加 return true或false.
例:<input type="submit" name="Submit" value="注 册" onClick=" return check();">,在JS中判断的时候 写return true; 或者 return false; button:普通的按钮,不会自动提交表单数据.可以在JS中显式提

交:document.form1.submit(),使用场合: 一个页面有多个提交按钮,需要根据用户的操作来确定到底提交到哪个控制器,这种情况下,就需要在JS中判断用户的操作,然后根据操作来给document.form1.action赋值并且document.form1.submit()来提交

===============如果想好所有的提交都在一个servlet中处理,该怎么做==================
提交的按钮也是HTML组件,所以也可以通过 getParameter()来得到,那么getParameter()的参数也需要固定下来

参数就是所有的表单的提交按钮的name,当然提交按钮的name要一样才能统一在一个servlet中根据提交按钮的值来区别操作

附代码:

js文件
在javaScript中关于submit和button的区别介绍 
用submit的时候,jsp页面
在javaScript中关于submit和button的区别介绍 
用button的时候,jsp代码
在javaScript中关于submit和button的区别介绍

Javascript 相关文章推荐
JavaScript的eval JSON object问题
Nov 15 Javascript
JavaScript call apply使用 JavaScript对象的方法绑定到DOM事件后this指向问题
Sep 28 Javascript
Fixie.js 自动填充内容的插件
Jun 28 Javascript
js不能跳转到上一页面的问题解决方法
Mar 01 Javascript
解决jquery版本冲突的有效方法
Sep 02 Javascript
javascript从定义到执行 你不知道的那些事
Jan 04 Javascript
Angular2 环境配置详细介绍
Sep 21 Javascript
BootStrap组件之进度条的基本用法
Jan 19 Javascript
vue router路由嵌套不显示问题的解决方法
Jun 17 Javascript
vue.js过滤器+ajax实现事件监听及后台php数据交互实例
May 22 Javascript
JavaScript 监听组合按键思路及代码实现
Jul 28 Javascript
使用vue3重构拼图游戏的实现示例
Jan 25 Vue.js
jQuery实现鼠标移到元素上动态提示消息框效果
Oct 20 #Javascript
图片动画横条广告带上下滚动可自定义图片、链接等等
Oct 20 #Javascript
jQuery 属性选择器element[herf*='value']使用示例
Oct 20 #Javascript
js数组的基本用法及数组根据下标(数值或字符)移除元素
Oct 20 #Javascript
浏览器的JavaScript引擎的识别方法
Oct 20 #Javascript
JS实现点击图片在当前页面放大并可关闭的漂亮效果
Oct 18 #Javascript
jquery 循环显示div的示例代码
Oct 18 #Javascript
You might like
Syphon 秘笈
2021/03/03 冲泡冲煮
php读取csv实现csv文件下载功能
2013/12/18 PHP
Codeigniter控制器controller继承问题实例分析
2016/01/19 PHP
Laravel 5.5官方推荐的Nginx配置学习教程
2017/10/06 PHP
laravel 解决ajax异步提交数据,并还回填充表格的问题
2019/10/15 PHP
tp5.1 实现setInc字段自动加1
2019/10/18 PHP
自适应高度框架 ----属个人收藏内容
2007/01/22 Javascript
关于JavaScript的一些看法
2009/05/27 Javascript
JS中类或对象的定义说明
2014/03/10 Javascript
JavaScript中的依赖注入详解
2015/03/18 Javascript
JavaScript学习小结(一)——JavaScript入门基础
2015/09/02 Javascript
jQuery焦点图轮播特效代码分享(3款)
2015/09/05 Javascript
vue.js实现点击后动态添加class及删除同级class的实现代码
2018/04/04 Javascript
小程序实现多选框功能
2018/10/30 Javascript
手把手带你封装一个vue component第三方库
2019/02/14 Javascript
js计算最大公约数和最小公倍数代码实例
2019/09/11 Javascript
微信小程序中target和currentTarget的区别小结
2020/11/06 Javascript
[10:21]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Aster 选手采访
2021/03/11 DOTA
Python使用PyGreSQL操作PostgreSQL数据库教程
2014/07/30 Python
Python最基本的数据类型以及对元组的介绍
2015/04/14 Python
Python如何实现文本转语音
2016/08/08 Python
python读取文件名称生成list的方法
2018/04/27 Python
python解析xml简单示例
2019/06/21 Python
Python爬虫抓取论坛关键字过程解析
2020/10/19 Python
详解Django自定义图片和文件上传路径(upload_to)的2种方式
2020/12/01 Python
如何用python开发Zeroc Ice应用
2021/01/29 Python
临床医学专业毕业生的自我评价
2013/10/17 职场文书
英语专业毕业生自荐信范文
2013/12/31 职场文书
房屋委托书范本
2014/04/04 职场文书
连锁超市项目计划书
2014/09/15 职场文书
2014年纠风工作总结
2014/12/08 职场文书
关于保护环境的建议书
2019/06/24 职场文书
幼师必备:幼儿园期末教师评语50条
2019/11/01 职场文书
goland 设置project gopath的操作
2021/05/06 Golang
浅谈MySQL之浅入深出页原理
2021/06/23 MySQL
python数字图像处理之图像自动阈值分割示例
2022/06/28 Python