html中submit和button的区别(总结) [ 转自欣步同学 ]

时间:2021-09-21 10:36:51

html中submit和button的区别(总结)

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>

html中submit和button的区别(总结) [ 转自欣步同学 ]的更多相关文章

  1. HTML中submit和button的区别

    submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了. 如果表单在点击提交按钮后需要用JS进行处理(包括输入验证)后再提交的话,通常都必须把submit改成butt ...

  2. js中submit和button的区别

    今天写一个js验证 遇到点小坑 记录一下 button-普通按钮,submit-提交按钮. submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了,submit和bu ...

  3. html中submit和button的区别&sol; window&period;location&period;href 不跳转 的问题

    <input type="button">  <input type="submit"> 这两个的区别 是 button 不会自动提交表 ...

  4. html中 submit和button的区别?

    前者是向数据库提交表单 后者是单纯的按钮功能

  5. 网站开发进阶&lpar;四十四&rpar;input type&equals;&quot&semi;submit&quot&semi; 和&quot&semi;button&quot&semi;的区别

    网站开发进阶(四十四)input type="submit" 和"button"的区别   在一个页面上画一个按钮,有四种办法: 这就是一个按钮.如果你不写ja ...

  6. submit和button的区别

    两者主要区别在于:submit可以提交表单(form),而button如果不指定onclick等事件处理函数,它是不做任何事情的.注意哦,在页面上<input type="submit ...

  7. ExecutorService中submit&lpar;&rpar;和execute&lpar;&rpar;的区别

    在使用java.util.concurrent下关于线程池一些类的时候,相信很多人和我一样,总是分不清submit()和execute()的区别,今天从源码方面分析总结一下. 通常,我们通过Execu ...

  8. ExecutorService中submit和execute的区别(转)

    在Java5之后,并发线程这块发生了根本的变化,最重要的莫过于新的启动.调度.管理线程的一大堆API了.在Java5以后,通过Executor来启动线程比用Thread的start()更好.在新特征中 ...

  9. ExecutorService中submit和execute的区别

    在Java5之后,并发线程这块发生了根本的变化,最重要的莫过于新的启动.调度.管理线程的一大堆API了.在Java5以后,通过Executor来启动线程比用Thread的start()更好.在新特征中 ...

随机推荐

  1. mysql时间格式DATE&lowbar;FORMAT&lpar;&rpar;

    1.以下是mysql查询中用到的时间格式的转化形式例子:SELECT DATE_FORMAT(NOW(),'%Y-%m-%d') -- 2015-10-28 SELECT DATE_FORMAT(NO ...

  2. K2BPM怎么让金融数据更有意义?

    西南证券成立于1999年,是唯一一家注册地在重庆的全国综合性证券公司,也是中国第九家上市证券公司和重庆第一家上市金融机构.公司现有员工逾2000名,在全国27个省份获批设立109家证券营业部,拥有17 ...

  3. 【字符串排序,技巧!】UVa 10905 - Children’s Game

    There are lots of number games for children. These games are pretty easy to play but not so easy to ...

  4. 百练&lowbar;2409 Let it Bead&lpar;Polya定理&rpar;

    描述 "Let it Bead" company is located upstairs at 700 Cannery Row in Monterey, CA. As you ca ...

  5. HTML基础了解

     对HTML最基本的认识和编写:"我的第一个网页" HTML是什么: 它的全称是Hyper Text Markup Language超文本标记语言,页面中包括有视频.图片.链接等其 ...

  6. ABP从入门到精通(2):aspnet-zero-core 使用MySql数据库

    关于 asp.net zero core 项目的启动及说明,请观看我前面的博文 http://www.cnblogs.com/stulzq/p/7237153.html 本操作对于ABP默认项目应该也 ...

  7. leetcode — powx-n

    /** * Source : https://oj.leetcode.com/problems/powx-n/ * * Created by lverpeng on 2017/7/18. * * Im ...

  8. Oracle通过ROWID删除表中重复记录

    -- 1 通过ROWID删除T1表里重复的记录    SELECT ROWID,A,B--DELETE FROM  T1WHERE ROWID IN (  SELECT RD  FROM  (     ...

  9. JavaSE&lowbar;坚持读源码&lowbar;HashMap对象&lowbar;get&lowbar;Java1&period;7

    当你从HashMap里面get时,你其实在干什么? /** * Returns the value to which the specified key is mapped, * or {@code ...

  10. 【转】vim 命令

    Vim命令合集 建议直接看原文:(排版有些乱) 命令历史 以:和/开头的命令都有历史纪录,可以首先键入:或/然后按上下箭头来选择某个历史命令. 启动vim 在命令行窗口中输入以下命令即可 vim 直接 ...