a标签的 onclick 和 href 哪个先执行?
以下这种写法,onclick 事件先执行, href 属性下的动作后执行(页面跳转或 javascript 伪链接),如果不想执行 href 属性下的动作,onclick 需要返回 false。
<a href="https://www.baidu.com/" onclick="doSomething()">链接</a>
这种写法我在写侧边导航栏的时候用到了,就是点击事件和页面跳转事件同时存在,可能页面跳转事件处理并没有覆盖掉点击事件的处理程序,所以暂时没有出现什么问题,但总感觉怪怪的,以后发现问题的话再补充吧……
如果实际应用中,确实需要 a 标签来响应 onclick 事件的,且不想执行 href 属性下的动作,推荐以下3种写法:
1、 javascript:void(0) 相当于一个死链接,href 不执行
<a href="javascript:void(0)" onclick="doSomething()">链接</a>
2、onclick 返回 false,href 不执行
<a href="https://www.baidu.com/" onclick="doSomething();return false;">链接</a>
3、onclick 返回 false,href 不执行
<a href="https://www.baidu.com/" onclick="doSomething();event.returnValue=false;">链接</a>
以下这种写法也可以用,但不推荐
<a href="javascript:open()">链接</a>
不推荐原因:尽量不要使用 javascript: 协议作为 a 的 href 属性,这样会导致不必要的触发 window.onbeforeunload 事件,在IE下还会使 gif 动画图片停止播放。
再严重一点,可能会有人这么写
<a href="javascript:open()" onclick="doSomething()">链接</a>
不推荐原因:我在想,如果这两个事件里处理的东西没有重叠,不会互相覆盖的话,那这么写可不可以?有待考证
a标签的 onclick 和 href 哪个先执行?的更多相关文章
- 关于a标签的onclick和href谁先执行的问题
今天上午遇到一个问题,我想在a标签跳转的时候增加一些程序上的判断,但又不会影响a标签的正常跳转,于是就有了这篇文章. 我的具体代码是这样的: <a href="http://www.m ...
- 关于a标签的onclick与href的执行顺序
onclick的事件被先执行,其次是href中定义的(页面跳转或者javascript), 同时存在两个定义的时候(onclick与href都定义了),如果想阻止href的动作,在onclick必须加 ...
- a标签的onclick和href事件的区别
在执行顺序上href是低于onclick的,那么这个会造成什么影响呢 <div onclick="a()"> <a href="#" oncl ...
- 说说a标签的onclick和href
在平时我们一般会在列表中的最后一列给加上操作功能,一般的操作功能是修改和删除,这个操作我们可以通过a标签来实现其功能. <a class="pn-opt" href=&quo ...
- a标签响应onclick事件,并且不执行href动作
1.javascript:void(0)相当于一个死链接,href不执行 <a href="javascript:void(0)" onclick="doSomet ...
- a标签中的onclick和href的使用
onclick和href 链接的 onclick 事件被先执行,其次是 href 属性下的动作(页面跳转,或 javascript 伪链接): 假设链接中同时存在 href 与 onclick,如果 ...
- ASP.Net MVC 中a标签的onclick时间和href同时存在时候的处理
问题出现: 本次项目在用到下载文件.导出文件的时候,需要在下载.导出之前进行判断,最初使用方式一.二,没能解决问题 方式一:使用href直接跳转controller方法,以下载为例: public A ...
- 【Javascript】IE8兼容 背景图片与a标签的onclick事件
先说几句牢骚话. 虽然IE8比之IE6.7有很大的进步,但是在执行效率.兼容性上仍然有很多问题.被广大开发者喜爱的平台才是好平台. 可惜多亏当年盗版XP打开中国的计算机市场,IE作为一款捆绑软件仍然在 ...
- 关于easyui框架中a标签使用onclick()触发事件偶尔会选项卡消失BUG解决方案
今天发现公司的一个easyui项目中有个页面会在触发onclick事件时选项卡消失,如下图 产生BUG后 产生BUG前 查找很多地方还有资料不知道哪里出现的问题,看了下框架源码之类的,因为不是专门的前 ...
随机推荐
- c# 锁的使用
1 互斥锁lock(基于Monitor实现) 定义: private static readonly object Lock = new object(); 使用: lock (Lock) { //t ...
- 「HEOI2016/TJOI2016」序列
题目链接 戳这 Solution 首先考虑最暴力的dp 我们设: \(f[i]\)表示选择\(i\)以后所能形成的满足条件的子序列的最大值 \(minx[i]\)表示\(i\)能转换为的最小值 \(m ...
- 十六、Node.js-fs模块-流
10. fs.createReadStream 从文件流中读取数据 /** * 之前我们学习过读取文件内容的方法readFile():该方法适合读取文件内容比较少的文件,如果遇到数据量庞大的文件,我们 ...
- java大数据批量处理实现方式
1. 各批量方式对比 Mybatis与JDBC批量插入MySQL数据库性能测试及解决方案 2. 原理解析 1)MySql PreparedStatement executeBatch过慢问题 3. 工 ...
- 可以避免的10大IT面试误区
在所有的面试过程当中,很多面试者都普遍犯了这样一个错误——由于对面试准备的不足,所以对于应聘公司的背景,以及一些最基本的信息都缺乏了解,有些面试者甚至对要面试的公司毫无所知.这些数据并不是空穴来风,A ...
- 洛谷P3355 骑士共存问题(最小割)
传送门 de了两个小时的bug愣是没发现错在哪里……没办法只好重打了一遍竟然1A……我有点想从这里跳下去了…… 和方格取数问题差不多,把格子按行数和列数之和的奇偶性分为黑的和白的,可以发现某种颜色一定 ...
- The server of Apache (四)——配置防盗链和隐藏版本信息
一.防盗链 防盗链就是防止别人的网站代码里面盗用我们服务器的图片.文件.视频等相关资源,比如我们的网页的图片有链接,别人把链接复制粘贴到他们的服务器页面里,图片不在他们自己的网站里,每次打开他们的网站 ...
- P4855 MloVtry的idea
$ \color{#0066ff}{ 题目描述 }$ MloVtry是一个脑洞很大的人,它总会想出一些奇奇怪怪的idea. 可问题是,MloVtry作为一个蒟蒻,很多时候都没办法解决自己提出的问题,所 ...
- 使用@符号让C#中的保留字做变量名的方法详解
原来还有一种办法就是加@符号(看了@符号的作用又多了一个): 复制代码代码如下: class @int { static void Main(string[] args) ...
- django中给ajax提交加上csrf
代码来自djangoproject网站 在html中的script标签下插入下面代码 在html文档加载时候运行下面代码,并且使用$.ajaxSetup设置ajax每次调用时候传入的数据,$.ajax ...