在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 相关文章推荐
jQuery使用手册之一
Mar 24 Javascript
javascript操作文本框readOnly
May 15 Javascript
浅谈javascript 面向对象编程
Oct 28 Javascript
jquery插件jquery倒计时插件分享
Dec 27 Javascript
在Linux上用forever实现Node.js项目自启动
Jul 09 Javascript
精通JavaScript的this关键字
May 28 Javascript
如何使用JS在HTML中自定义字符串格式化
Jul 20 Javascript
Angular 4.0学习教程之架构详解
Sep 12 Javascript
vue3.0 CLI - 1 - npm 安装与初始化的入门教程
Sep 14 Javascript
JS实现可用滑块滑动的缓动图代码
Sep 01 Javascript
JavaScript中的函数式编程详解
Aug 22 Javascript
Vue this.$router.push(参数)实现页面跳转操作
Sep 09 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
收音机术语解释
2021/03/01 无线电
PHP 函数语法介绍一
2009/06/14 PHP
PHP批量获取网页中所有固定种子链接的方法
2016/11/18 PHP
老生常谈php中传统验证与thinkphp框架(必看篇)
2017/06/10 PHP
TP5框架简单登录功能实现方法示例
2019/10/31 PHP
利用jQuery接受和处理xml数据的代码(.net)
2011/03/28 Javascript
js跨浏览器实现将字符串转化为xml对象的方法
2013/09/25 Javascript
基于jQuery1.9版本如何判断浏览器版本类型
2016/01/12 Javascript
JS实现把鼠标放到链接上出现滚动文字的方法
2016/04/06 Javascript
jquery ajax局部加载方法详解(实现代码)
2016/05/12 Javascript
关于两个jQuery(js)特效冲突的bug的解决办法
2016/09/04 Javascript
解析NodeJs的调试方法
2016/12/11 NodeJs
使用SVG基本操作API的实例讲解
2017/09/14 Javascript
jQuery实现判断滚动条滚动到document底部的方法分析
2019/08/27 jQuery
解决vue自定义全局消息框组件问题
2019/11/22 Javascript
JS桶排序的简单理解与实现方法示例
2019/11/25 Javascript
vue+swiper实现左右滑动的测试题功能
2020/10/30 Javascript
简单的通用表达式求10乘阶示例
2014/03/03 Python
Python常用模块用法分析
2014/09/08 Python
python妹子图简单爬虫实例
2015/07/07 Python
Python创建对称矩阵的方法示例【基于numpy模块】
2017/10/12 Python
python 美化输出信息的实例
2018/10/15 Python
Python错误的处理方法
2020/06/23 Python
python3从网络摄像机解析mjpeg http流的示例
2020/11/13 Python
FitFlop澳大利亚官网:英国符合人体工学的鞋类品牌
2017/06/05 全球购物
美国珠宝店:Helzberg Diamonds
2018/10/24 全球购物
荷兰美妆护肤品海淘网站:Beautinow(中文)
2020/11/22 全球购物
应届生人事助理求职信
2013/11/09 职场文书
就业自荐信
2013/12/04 职场文书
毕业生自荐书
2014/02/03 职场文书
学校后勤岗位职责
2014/02/19 职场文书
房地产开发项目建议书
2014/05/16 职场文书
庆祝儿童节标语
2014/10/09 职场文书
离婚案件答辩状
2015/05/22 职场文书
中学团支部工作总结
2015/08/13 职场文书
js中Object.create实例用法详解
2021/10/05 Javascript