在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 动态参数判空操作
Dec 22 Javascript
Package.js  现代化的JavaScript项目make工具
May 23 Javascript
JavaScript截取指定长度字符串点击可以展开全部代码
Dec 04 Javascript
js判断是否为空和typeof的用法(详解)
Oct 07 Javascript
Vue.js实战之Vuex的入门教程
Apr 01 Javascript
AngularJS实现自定义指令与控制器数据交互的方法示例
Jun 19 Javascript
JS 实现banner图片轮播效果(鼠标事件)
Aug 04 Javascript
微信小程序上传图片功能(附后端代码)
Jun 19 Javascript
微信小程序收货地址API兼容低版本解决方法
May 18 Javascript
JS模拟浏览器实现全局搜索功能
Sep 11 Javascript
ionic2.0双击返回键退出应用
Sep 17 Javascript
vue绑定数字类型 value为数字的实例
Aug 31 Javascript
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
php正则表达式(regar expression)
2011/09/10 PHP
php操作redis缓存方法分享
2015/06/03 PHP
PHP token验证生成原理实例分析
2019/06/05 PHP
Laravel 实现数据软删除功能
2019/08/21 PHP
asp.net和php的区别点总结
2019/10/10 PHP
Laravel 修改验证异常的响应格式实例代码详解
2020/05/25 PHP
动态加载js的几种方法
2006/10/23 Javascript
JS分页控件 可用于无刷新分页
2013/07/23 Javascript
jquery弹出框的用法示例(一)
2013/08/26 Javascript
js图片延迟技术一般的思路与示例
2014/03/20 Javascript
JavaScript实现的购物车效果可以运用在好多地方
2014/05/09 Javascript
nodeJs爬虫获取数据简单实现代码
2016/03/29 NodeJs
深入理解JavaScript中为什么string可以拥有方法
2016/05/24 Javascript
让你一句话理解闭包(简单易懂)
2016/06/03 Javascript
简洁实用的BootStrap jQuery手风琴插件
2016/08/31 Javascript
jQuery动态生成表格及右键菜单功能示例
2017/01/13 Javascript
vue实现引入本地json的方法分析
2018/07/12 Javascript
解决使用bootstrap的dropdown部件时报错:error:Bootstrap dropdown require Popper.js问题
2018/08/30 Javascript
Vue动态加载异步组件的方法
2018/11/21 Javascript
JS温故而知新之变量提升和时间死区
2019/01/27 Javascript
vue中的v-model原理,与组件自定义v-model详解
2020/08/04 Javascript
[40:04]Secret vs Infamous 2019国际邀请赛淘汰赛 败者组 BO3 第二场 8.23
2019/09/05 DOTA
Python修改MP3文件的方法
2015/06/15 Python
Python实现以时间换空间的缓存替换算法
2016/02/19 Python
Python 模板引擎的注入问题分析
2017/01/01 Python
Python多重继承之菱形继承的实例详解
2020/02/12 Python
DNA基因检测和分析:23andMe
2019/05/01 全球购物
护士实习生自我鉴定范文
2013/12/10 职场文书
法学专业本科生自荐信范文
2013/12/17 职场文书
鼓励运动员的广播稿
2014/02/08 职场文书
酒店管理失职检讨书
2014/09/16 职场文书
学校党委干部个人对照检查材料思想汇报
2014/10/09 职场文书
学校证明范文
2015/06/24 职场文书
大学班长竞选稿
2015/11/20 职场文书
JavaScript实现班级抽签小程序
2021/05/19 Javascript
Nginx使用ngx_http_upstream_module实现负载均衡功能示例
2022/08/05 Servers