什么时候用button,什么时候用a标签
什么时候用button,什么时候用a标签
一、问题
能实现链接功能的标签一般就a标签,button标签,input submit标签
input submit肯定是提交表单的时候用
那什么时候用button,什么时候用a标签
能用a标签的地方尽量使用a标签么?
只有在例如type=submit的时候才使用button标签?
是否a标签比button标签更好?原因是什么?
那一个按钮 点击弹出来弹窗,或者一个按钮点击触发一个事件(例如收藏),用什么比较好?
二、解答
特意去翻了之前看过的一篇文章。
你不能创造一个按钮
个人觉得主要三个原因:
尊重一个标签被创造出来时的初衷
在PC端使用tab或者方向键切换焦点后,按下enter键,button(input[type=button])的click事件会被触发而其他标签不会。
你想实现一个disabled属性时,a标签需要一句似乎麻烦一些
语义上说,a一般是链接,一般指向一个地址;button是按钮,一般点击后调用本页方法。
实际上随你便,只要你写的代码没有看了想开除你,想用什么都无所谓
另外,button貌似默认就是type=submit吧,放在表单里的裸button点击就提交表单了,不过我一般用input type=submit,除非是按钮里需要放一些比较花哨的内容时才会用button
需要添加链接,或者直接从服务端get数据的用a标签。其他地方button可以的话就用button。没有哪个便签比哪个更好,只有哪个标签更适用哪些场景。你可以通过以下方法权衡一下:
1.需要与后端进行数据交互吗?不需要的话button即可
2.要与后端交互?如果是get方式的话使用a标签很方便。如果是post等方式,用button,绑定ajax事件即可
具体看情况,按钮功能上用input或者button都可以。
但是button里面可以嵌套内容,input则不行,所以具体情况具体看。
a标签一般用作超链接或者锚链接。
理论上你用一个a标签也可以做出button的样式。所以具体还是要看实际情况的。
什么时候用button,什么时候用a标签的更多相关文章
- a标签中可以加button,但是不提倡;button中不能加a标签,否则不能跳转
a标签中可以加button,但是不提倡:button中不能加a标签,否则不能跳转
- 如何解决button,a,input标签自带蓝色边框
通常我们会设置该标签outline:0;但是我在使用iview自带的button组件的时候,设置无效,经过测试只要设置 :focus{ outline:0; } 即可,方便有效
- 让button居中显示的的标签
<center> <input type="button" class="buttoncls" style="width:80px& ...
- button提交表单 a标签提交表单
<form name="searchForm" id="searchForm" method="get" action="/ ...
- 【js & jquery】遮罩层实现禁止a、span、button等元素的鼠标事件
刚才在写一个界面,其中为了考虑背景图片的缘故,所以没用Button而是用的a标签 在点击之后应该禁用掉a元素,禁用对于button比较容易,加一个disabled就可以了 但是对于a却没有太好的办法, ...
- [Learn AF3]第四章 App framework组件之Button
Button 组件名称:Button 是否js控件:否 使用说明:如果说panel组件是af3的“核心(heart of the ui)”,那么Button就是af中的五虎上将之 ...
- antd button
引用 :import { Button } from 'antd'; <Button type = "primary" //按钮样式颜色 shape = "circ ...
- button在firefox 和 ie 下的问题
最近做了一个关于数据库管理的项目,因为不用考虑ie9以下的兼容性,所以一股脑的写完啦,到测试的时候发现了一个bug IE和火狐下有个模块关闭按钮的hover没有反应,ie不行就算了,火狐怎么也不行?我 ...
- amazeui学习笔记--css(HTML元素1)--按钮Button
amazeui学习笔记--css(HTML元素1)--按钮Button 一.总结 1.button的基本使用:a.am-btn 在要应用按钮样式的元素上添加 .am-btn,b.颜色 再设置相应的颜色 ...
- web前端基础知识
#HTML 什么是HTML,和他ML... 网页可以比作一个装修好了的,可以娶媳妇的房子. 房子分为:毛坯房,精装修 毛坯房的修建: 砖,瓦,水泥,石头,石子.... 精 ...
随机推荐
- 细说ReactiveCocoa的冷信号与热信号(一)
热信号:事件触发: 冷信号:订阅出发: 从本质上来说,是信号的存在和产生,是静态信号和动态信号的区别. 背景 ReactiveCocoa(简称RAC)是最初由GitHub团队开发的一套基于Cocoa的 ...
- UI Framework-1: Aura Client API
Client API The Aura Client API is an API Aura uses to communicate with the client application using ...
- last-child到底怎么用
今天工作时候遇到的坑, 看来还是css基础不够扎实,特此记录一下, <div> <p>1</p> <p>2</p> <p>3&l ...
- iOS——集成支付宝 系统繁忙,请稍后再试ALI10
问题描述:调用支付宝时,显示系统繁忙,请稍后再试(ALI10).代码没有报错,其他也是按照文档来的,为何老是提示显示系统繁忙? 解决方案:还需要在targets的中info里面,添加 url typ ...
- 做一个萌萌哒的button之box-shadow
接上篇:http://blog.csdn.net/u010037043/article/details/47035077 一.box-shadow box-shadow是给元素块加入周边阴影效果. b ...
- 使用ssh过程中对数据库进行update时报错
报错信息:org.springframework.dao.InvalidDataAccessApiUsageException: Write operations are not allowed in ...
- TCP/IP具体解释--TCP的分段和IP的分片
写在前面: 分组能够发生在运输层和网络层.运输层中的TCP会分段,网络层中的IP会分片.IP层的分片很多其它的是为运输层的UDP服务的,因为TCP自己会避免IP的分片,所以使用TCP传输在IP层都不会 ...
- 洛谷P1919 【模板】A*B Problem升级版(FFT快速傅里叶)
题目描述 给出两个n位10进制整数x和y,你需要计算x*y. 输入输出格式 输入格式: 第一行一个正整数n. 第二行描述一个位数为n的正整数x. 第三行描述一个位数为n的正整数y. 输出格式: 输出一 ...
- 洛谷P1586 四方定理
题目描述 四方定理是众所周知的:任意一个正整数nn ,可以分解为不超过四个整数的平方和.例如:25=1^{2}+2^{2}+2^{2}+4^{2}25=12+22+22+42 ,当然还有其他的分解方案 ...
- Cisco交换机端口安全
Cisco交换机端口安全 通过端口设置,可以限制允许访问交换机上某个端口的MAC地址以及IP(可选)来实现严格控制对该端口的输入,最终确保网络接入安全.配置网络安全时应该注意如下问题: 1 ...