Html A标签中 href 和 onclick 同时使用的问题优先级别

作者：绿色软件编辑点击：2165次评论：1次标签： html onclick

2014年辛星HTML和CSS教程夏季版

类型：电子资料大小：3.9M语言：中文评分：10.0
标签：

立即下载

我们在制作网页的时候用得最多的就是 A 标签超连接

但有时候需要在 A 里同时用到 href 和 onclick属性下面我们先来分析一下，在不同的浏览器下有不同的效果

1 顺序
ie 6 : href 先触发 onclick 后触发
其他浏览器先触发onlick 后触发 href

2 href="javascript: xxx()"
不能传入this作为参数
onclick可以
<a href="javascript:alert('href event');" onclick="clickevent(this);">

3 优先触发的方法如果返回 false 导致后一个事件不被触发
比如
<a href="javascript:alert('href event');" onclick="clickevent(this); return false;">

4
<a href="#"> 会导致页面定位到书签位置，

5
由于 1和 4 的原因
在ie6 下同时有 <a href="#" 和 onclick的时候由于页面先因为href重新载入了一次，导致 onclick事件被浏览器丢弃。

6 总结：
1) 在不需要传递this作为方法的参数时候，推荐
只使用href="JavaScript: "

2) 如果需要使用this参数，推荐
<a href="javascript:void(0);" onclick="doSomthing(this)" >

如下面一个列子。

我们需要A在第一次和第二次点击的时候访问 href 第3次以后的就访问另一个地址

var href=0

function clicka(obj)
{
if (href==2)
{
obj.href="http://www.86p.com/?qc";
}else
{
href++;
}
return true;

}