button与submit
原文来自:
http://blog.sina.com.cn/s/blog_693d183d0100uolj.html
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中根据提交按钮的值来区别操作
======================关于路径的设置===================================
A.在页面中直接写路径,如 href="jsp/a.html" 表示平级目录的访问,此例表示平级目录中有个JSP文件夹,访问的是文件夹中的a.html文件
B.在JAVA中直接写路径,如 response.sendRedirect("jsp/a.jsp")表示项目根目录下有个JSP文件夹,访问的是文件夹中的a.jsp文件
C.如果发现以上设置在浏览器中的地址栏不正确,可以采取绝对路径写法:/工程名/文件夹名/文件名
但是对于从事WEB UI的人应该要注意到,使用submit来提高页面易用性:
使用submit后,页面支持键盘enter键操作,而很多WEB软件设计师,可能没有注意到submit统一.
用button后往往页面不支持enter键了。所以需要支持enter键,必须要设置个submit,默认enter键对页面第一个submit进行操作。
<input type="submit" name="b1" value="提交" onClick="bt_submit_onclick()">
执行完onClick,转到action。可以自动提交不需要onClick,所以说onclick这里可以不要。
<input type="button" name="b1" value="提交" onClick="bt_submit_onclick()">
执行完onClick,跳转文件在 js文件里控制,提交需要onClick.如果这儿没有 onClick
例如:
type="submit"
<form id="frm1" action="<%=request.ServerVariables("Script_Name")%>" method="post" onSubmit="return check_submit(this)">
<input id="btnconfirm" type="submit" value="确定" name="btnconfirm"></form>
type="button"
<form id="frmAddModi" action="<%=request.ServerVariables("Script_Name")%>" method="post" name="frmAddModi" >
<input id="btnconfirm" type="button" value="确定" name="btnconfirm" onClick="check(frmAddModi);"/></form>
button与submit的更多相关文章
- 在jQuery ajax中按钮button和submit的区别分析
在使用jQuery ajax的get方法进行页面传值,不能用submit,否则无刷新获取数据展示 点击submit提交按钮,sendPwd.php通过$_POST接收传过来的值,然后echo一段数据. ...
- input的button和submit的区别
故事由来: 其实这个问题,昨天已经遇到过,但是昨天是公司的一枚老员工帮助我这个实习生调的,而且我也确(猜)定(测)那枚老员工也不知道这个区别.然后今天又遇到相同问题. 故事梗概: 现在公司里面做一个项 ...
- 表单提交中的input、button、submit的区别
1.input[type=submit] 我们直接来看例子: 代码如下: <form> <input name="name"> <input type ...
- 表单提交:button input submit 的区别
http://harttle.com/2015/08/03/form-submit.html 最近项目代码中的表单提交的方式已经百花齐放了,现在用这篇文章来整理一下不同表单提交方式的区别,给出最佳实践 ...
- button 和 submit 的区别
表单提交中button和submit的区别submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了,submit和button,二者都以按钮的形式展现,看起来都是按钮, ...
- input button 与 submit 的区别
在表单中,我们会经常提交数据,通常使用<input type="submit" value="提交"/>进行提交数据, 另一种方式是使用<bu ...
- [转]表单提交:button input submit 的区别
博客转自于 http://harttle.com/2015/08/03/form-submit.html ,同时自己做了稍微改动 最近项目代码中的表单提交的方式已经百花齐放了,现在用这篇文章来整 ...
- button和submit区别
type=button 就单纯是按钮功能 type=submit 是发送表单 但是对于从事WEB UI的人应该要注意到,使用submit来提高页面易用性: 使用submit后,页面 ...
- 关于button和submit的form提交以及 页面跳转问题
最近在做官网的注册登录form提交时遇到了这个问题,1.0时因为使用普通的模板并没有出现页面跳转失败问题 由于2.0时更换了注册模板,此时按钮样式是以下样式 而在css样式的模板里使用的是button ...
- jsp中button与submit的用法
button:可以对返回的数据进行格式化,反应到页面上,可以用form表单序列化提交也可以不用form表单提交 <form id="addForm"> <inpu ...
随机推荐
- Win2D 官方文章系列翻译 - 幕后绘制
本文为个人博客备份文章,原文地址: http://validvoid.net/win2d-offscreen-drawing/ 应用有时需要将图形绘制到并不立即显示的目标上.此类绘制动作被称作“幕后绘 ...
- Orchard官方文档翻译(二) 安装 Orchard
原文地址:http://docs.orchardproject.net/Documentation/Installing-Orchard 想要查看文档目录请用力点击这里 最近想要学习了解orchard ...
- nginx 编译模块说明
--prefix= <path> - Nginx安装路径.如果没有指定,默认为 /usr/local/nginx. --sbin-path= <path> - Nginx可执行 ...
- plsql自定义快捷键
说明:如 输入 sf按空格 就变成 SELECT * FROM 输入 w空格 就变成 WHERE 可以帮助你快速的写语句,配置如下图
- c# 将页面导出到word(含图片及控件)
/// <summary> /// 创建word /// <param name="filePath">文件路径 </param> /// &l ...
- 【Hibernate 3】一对一映射配置
一.一对一映射简介 一对一关联映射有两种实现策略: 第一种:主键关联,即让两个对象具有相同的主键值,以表明它们之间的一一对应的关系:数据库表不会有额外的字段来维护它们之间的关系,仅通过表的主键来关联 ...
- SQL 1:常用SQL语句
导读:最近写代码,几乎是天天泡在SQL语句里,各种代码各种写.但一直缺少总结,要不就是觉得简单,要不就是觉得大家都知道.想来,我还是没能明白总结的价值在哪里.现在也就写写最近都常写的一些语句. 一,i ...
- dell 交换机 双链路冗余
公司海外机房引入2G带宽,是由2个电口绑定实现的.因业务需要扩容到3G,在绑定端口扩展性不太好,因此直接上10G光纤模块. 机房技术人员建议,2g老线路不撤做备份,3g新线路在线使用.使用STP协议实 ...
- Question2Answer初体验
Question2Answer初体验 高质量的问答社区十分有价值,很多无法解决的问题能通过问答社区找到解决办法,而对于站长来说,垂直的问答社区也很有潜力.最近盯上问答这一块,发现和我的一些思路很符 ...
- Heavily reliance on forensic tools is risky
We could take advantage of forensic tools to examine and analyze the evidence, but heavily reliance ...