input type="submit" 和"button"有什么区别?
http://www.zhihu.com/question/20839977
- <input type="button" /> 这就是一个按钮。如果你不写javascript 的话,按下去什么也不会发生。
- <input type="submit" /> 这样的按钮用户点击之后会自动提交 form,除非你写了javascript 阻止它。
- <button> 这个按钮放在 form 中也会点击自动提交,比前两个的优点是按钮的内容不光可以有文字,还可以有图片等多媒体内容。(当然,前两个用图片背景也可以做到)。它的缺点是不同的浏览器得到的 value 值不同;可能还有其他的浏览器兼容问题(葛亮)。
- 其他标签,例如 a, img, span, div,然后用图片把它伪装成一个按钮。
参见:
[原]<button>和<input type="button"> 的区别
html - Difference between <input type='button' /> and <input type='submit' />
html - input type="submit" Vs button tag are they interchangeable?
需要强调的一点是,其实<input type="submit" />不是一个画面元素,而是一个表单(Form)元素,和文本输入是一样的,都属于“数据”的一部分(特征是,有value属性,而且该属性的值,会被传送到server端,可以拿来用),而不是样式的一部分。这种表现和数据混淆的设计,是早期web标准还比较简陋的时代的遗产。
从画面表现上看,通过CSS可以把两者描绘得完全一样。
从画面动作上看,通过JS可以强制两者动作也一致(都提交或者都不提交)。
但是只有表单数据这个特性,是无法混淆的。<button>无法把自己当成Form的数据。
所以,如果只是个单纯的按钮,触发一些画面动作,请使用<button>;反之,会把画面的数据提交给Server的,一般用<input type="submit" />,当然<button>+JS也完全可以取代。
input type="submit" 和"button"有什么区别?的更多相关文章
- input type="submit" 和"button"有什么区别
HTML中<input type="submit" /> 和 <input type="button" /> 主要从元素定义类型.点击触 ...
- 网站开发进阶(四十四)input type="submit" 和"button"的区别
网站开发进阶(四十四)input type="submit" 和"button"的区别 在一个页面上画一个按钮,有四种办法: 这就是一个按钮.如果你不写ja ...
- <input type="button" /> 和<input type="submit" /> 的区别
<input type="button" /> 这就是一个按钮.如果你不写javascript 的话,按下去什么也不会发生.<input type="s ...
- <input type = "submit"> 提交方式和用js的form.submit()有什么区别?
假设: A表单内有<input type="submit">,通过点击这个input来提交表单 B表单内没有<input type="submit&qu ...
- input[type='submit']input[type='button']button等按钮在低版本的IE下面,去掉黑色边框的问题
今天做一个tabs效果的时候,发现上面的button在低版本下会出现黑色的边框,很难看,于是我整理了下几个去掉黑色边框的办法: 1.在button的外层嵌套一个div,设置button的border: ...
- 表单中submit和button按钮的区别!
对于表单的按钮以前知道submit和button有区别,但没有深入探索,今天刚好又碰到这个问题,看了下网络上这位朋友已经有现成的总结了,而且比较到位,拿来跟大家分享下(原文地址:http://blog ...
- input type=“submit”屏蔽自带的提交事件
<p><input type="submit" class="submit" value="确认支付" onclick=& ...
- ajax post提交数据, input type=submit 返回prompt aborted by user
添加 return false;否则就报prompt aborted by user异常
- html中submit和button的区别/ window.location.href 不跳转 的问题
<input type="button"> <input type="submit"> 这两个的区别 是 button 不会自动提交表 ...
随机推荐
- KVM虚拟机CPU说明
废话不多说了,下面对kvm虚拟机的CPU说明做一梳理:NUMA技术介绍NUMA是一种解决多CPU共同工作的技术方案,我们先回顾下多CPU共同工作的技术架构历史.多CPU共同工作主要有三种架构,分别是S ...
- VS代码片段(snippet)创作工具——Snippet Editor(转)
原文:http://blog.csdn.net/oyi319/article/details/5605502 从Visual Studio 2005开始,IDE支持代码片段.代码片段以代码缩写和TAB ...
- 利用ViewHolder优化自定义Adapter的典型写法
1 public class MarkerItemAdapter extends BaseAdapter { private Context mContext = null; private List ...
- Eclipse里面启用genymotion
E:/Users/zhuxuekui/AppData/Local/Android/sdk as里面的SDK目录 1.打开eclipse并从云仓库里面下载genymotion插件 注意:这里面有一个坑, ...
- 如何拿到半数面试公司Offer——我的Python求职之路(转)
原文出处:http://www.cnblogs.com/Lands-ljk/p/5836492.html 从八月底开始找工作,短短的一星期多一些,面试了9家公司,拿到5份Offer,可能是因为我所面试 ...
- LINUX SSH显示中文乱码
ssh登陆后,执行: export LANG=zh_CN.gb2312就可以显示中文了.编辑/etc/sysconfig/i18n 将LANG="zh_CN.UTF-8" 改为 L ...
- 用python简单处理图片(1):打开\显示\保存图像
一提到数字图像处理,可能大多数人就会想到matlab,但matlab也有自身的缺点: 1.不开源,价格贵 2.软件容量大.一般3G以上,高版本甚至达5G以上. 3.只能做研究,不易转化成软件. 因此, ...
- [CareerCup] 3.5 Implement Queue using Two Stacks 使用两个栈来实现队列
3.5 Implement a MyQueue class which implements a queue using two stacks. LeetCode上的原题,请参见我之前的博客Imple ...
- [CareerCup] 8.7 Chat Server 聊天服务器
8.7 Explain how you would design a chat server. In particular, provide details about the various bac ...
- C#中out和ref之间的区别
首先:两者都是按地址传递的,使用后都将改变原来参数的数值. 其次:rel可以把参数的数值传递进函数,但是out是要把参数清空,就是说你无法把一个数值从out传递进去的,out进去后,参数的数值为空,所 ...