在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 相关文章推荐
asp 的 分词实现代码
May 24 Javascript
List the Stored Procedures in a SQL Server database
Jun 20 Javascript
javascript动画效果类封装代码
Aug 28 Javascript
Ruffy javascript 学习笔记
Nov 30 Javascript
window.location的重写及判断location是否被重写
Sep 04 Javascript
js数组操作方法总结(必看篇)
Nov 22 Javascript
微信公众号  提示:Unauthorized API function 问题解决方法
Dec 05 Javascript
javascript 删除数组元素和清空数组的简单方法
Feb 24 Javascript
iscroll动态加载数据完美解决方法
Jul 18 Javascript
node使用promise替代回调函数
May 07 Javascript
JavaScript静态作用域和动态作用域实例详解
Jun 17 Javascript
8 个有用的JS技巧(推荐)
Jul 03 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之CodeIgniter学习笔记
2013/06/17 PHP
Yii使用find findAll查找出指定字段的实现方法
2014/09/05 PHP
php返回相对时间(如:20分钟前,3天前)的方法
2015/04/14 PHP
PHP中preg_match正则匹配中的/u、/i、/s含义
2015/04/17 PHP
php 从指定数字中获取随机组合的简单方法(推荐)
2017/04/05 PHP
详解php中curl返回false的解决办法
2019/03/18 PHP
谈谈jQuery Ajax用法详解
2015/11/27 Javascript
JavaScript Array对象详解
2016/03/01 Javascript
JavaScript设计模式之单体模式全面解析
2016/09/09 Javascript
Javascript基础回顾之(三) js面向对象
2017/01/31 Javascript
JavaScript严格模式下关于this的几种指向详解
2017/07/12 Javascript
nginx配置React静态页面的方法教程
2017/11/03 Javascript
2019 年编写现代 JavaScript 代码的5个小技巧(小结)
2019/01/15 Javascript
python实现简单的TCP代理服务器
2014/10/08 Python
详谈Python中列表list,元祖tuple和numpy中的array区别
2018/04/18 Python
Python + selenium自动化环境搭建的完整步骤
2018/05/19 Python
Windows系统下PhantomJS的安装和基本用法
2018/10/21 Python
使用python将请求的requests headers参数格式化方法
2019/01/02 Python
python将处理好的图像保存到指定目录下的方法
2019/01/10 Python
详解DeBug Python神级工具PySnooper
2019/07/03 Python
python 3.6.7实现端口扫描器
2019/09/04 Python
Python 窗体(tkinter)下拉列表框(Combobox)实例
2020/03/04 Python
Python Socket TCP双端聊天功能实现过程详解
2020/06/15 Python
python3 中使用urllib问题以及urllib详解
2020/08/03 Python
解决python的空格和tab混淆而报错的问题
2021/02/26 Python
前端水印的简单实现代码示例
2020/12/02 HTML / CSS
印尼太阳百货公司网站:Matahari
2018/02/04 全球购物
网站域名和主机:Domain.com
2019/04/01 全球购物
个人现实表现材料
2014/02/04 职场文书
公司合作协议书范本
2014/04/18 职场文书
2014年物业公司工作总结
2014/11/22 职场文书
房产电话营销开场白
2015/05/29 职场文书
运动会宣传语
2015/07/13 职场文书
高中政治教学反思
2016/02/23 职场文书
导游词之黄帝陵景区
2019/09/16 职场文书
vue实现滑动解锁功能
2022/03/03 Vue.js