标签响应javascript的href处理[转载]
为了给一个<a />标签绑定javascript,但又不让它跳转链接,大家习惯上用的都是
<a href="javascript:;" onclick="test();">第一种</a>
<a href="javascript:void(0);" onclick="test();">第二种</a>
<a href="#" onclick="test();">第三种</a>
而结果呢,几乎每一种用法都会有所问题
第一种和第二种似乎没有区别,似乎也是最常用,但IE6下,点击的瞬间,会中止后续资源的载入,如果页面上存在着gif动画,那么,在点击这个链接的一瞬间,页面上的gif将会被中止。这会是很杯具的体验。
第三种虽然在IE6下面,gif动画不会被中止,但在各个浏览器下,点击了链接之后,都会被跳回页首。其实它就是一个空锚点,被跳到页首。这对于有滚动条的页面,似乎也是一个杯具的体验。
于是当时经过试验,使用了第四种方法:
<a href="###" onclick="test();">第四种</a>
这个方法圆满解决了以上的问题。
第四种方法我用了许久,一直都被我作为最圆满的解决方法,但最近做的评论系统被嵌进带有FLASH视频的文章时,我又发现杯具了。
可以参考一下178的视频,例如以下
http://donghua.178.com/donghua_play/16582.html
乍一看似乎一切很正常,但右侧的动画集数,点完之后,URL后都会带一个#play的锚点
于是页面的URL将会变成
http://donghua.178.com/donghua_play/16582.html#play
这时,将鼠标点进中间的视频,也就是flash部分,就会发现,页面的标题栏文字丢失了,变成了#play,如果用的是第四种方法的###,那么标题栏也会变成#
虽然说不影响大局,但也是一种不良的体验。
山穷水尽之时,得到了大牛的指点……最后解决了,方法如下:
<a href="javascript:void(0);" onclick="test(); return false;">最终方法</a>
onclick的最后加上了return false;之后,IE6也听话了。
参考大牛的BLOG:http://www.yclass.com/post/23.html
不过,至于页面真的需要锚点的话,可以考虑使用javascript来实现锚点的功能。
标签响应javascript的href处理[转载]的更多相关文章
- A标签使用javascript:伪协议
一.前言 今天,遇到一个别人挖的坑,问题是这样的. 做了一个列表页,可以筛选数据,有很多筛条件.主要是有input复选框和<a>标签两种.如图: 其中房价的筛选条件使用<a>标 ...
- JavaScript test//href
目录 JavaScript test//href JavaScript test//href href 其实这个问题并不属于这里的.但是呢,由于一天晚上因为这个问题扰我"一夜不能眠" ...
- 如何用iframe标签以及Javascript制作时钟?
如何利用iframe标签以及Javascript制作时钟? 如何制作一个时钟呢?效果如下图所示: 这里的时钟会不停的走,但是下面的页面是不会变得,这样就实现了我们想要的效果了.下面我将分为以下几个方面 ...
- a标签响应onclick事件,并且不执行href动作
1.javascript:void(0)相当于一个死链接,href不执行 <a href="javascript:void(0)" onclick="doSomet ...
- a标签的 onclick 和 href 哪个先执行?
以下这种写法,onclick 事件先执行, href 属性下的动作后执行(页面跳转或 javascript 伪链接),如果不想执行 href 属性下的动作,onclick 需要返回 false. &l ...
- javascript中href和replace比较
在使用javascript的时候,有时候对于经常使用的方法太熟悉而忽略了他们之间原理的细微差别.举例如下:window.location.href,window.location.replace. ...
- JavaScript可否多线程? 深入理解JavaScript定时机制(转载)
说明:最近写 js 时需要用setinterval函数做定时操作,谁知道,刚开始后运行完好,但一段时间后他就抽风了,定时任务运行的时间间隔越来越短,频率加快,这是一个完全不能容忍的问题,带着一个可以出 ...
- JavaScript控制href属性进行钓鱼
前一阵子,发现JavaScript中允许临时改变<a>标签的href属性,当改变其属性后你点击它可能看不出有多严重,但是,它可以通过欺骗手段来诱骗用户透露他们的详细资料. // Uncom ...
- a标签中javascript和void
<body> <a href="javascript:;">点了无反应</a> <a href="javascript:void ...
随机推荐
- vim 如何编辑 GB2312 编码的文件?
vim 如何编辑 GB2312 编码的文件? 彻底搞清楚字符编码: ASCII, ISO_8859, GB2312,UCS, Unicode, U 结合file和iconv命令转换文件的字符编码类型 ...
- myeclipse报异常:java.lang.OutOfMemoryError: Java heap space
- tarjan+缩点+强连通定理
C - Network of Schools Time Limit:1000MS Memory Limit:10000KB 64bit IO Format:%I64d & %I ...
- Hadoop-1.2.1学习之Job创建和提交源码分析
在Hadoop中,MapReduce的Java作业通常由编写Mapper和Reducer開始.接着创建Job对象.然后使用该对象的set方法设置Mapper和Reducer以及诸如输入输出等參数,最后 ...
- android使用achartengine 实现折线图
折线图的实现分为下边几个步骤: 1.第一步:数据的准备 XYMultipleSeriesDataset mDataset = new XYMultipleSeriesDataset(); XYSeri ...
- node:爬虫爬取网页图片
代码地址如下:http://www.demodashi.com/demo/13845.html 前言 周末自己在家闲着没事,刷着微信,玩着手机,发现自己的微信头像该换了,就去网上找了一下头像,看着图片 ...
- 自己动手写CPU之第四阶段(3)——MIPS编译环境的建立
将陆续上传本人写的新书<自己动手写CPU>(尚未出版).今天是第13篇.我尽量每周四篇 4.4 MIPS编译环境的建立 OpenMIPS处理器在设计的时候就计划与MIPS32指令集架构兼容 ...
- laravel使用的模板引擎 blade
使用blade引擎的话必须在控制器中使用use Blade
- AutoFac文档4(转载)
目录 开始 Registering components 控制范围和生命周期 用模块结构化Autofac xml配置 与.net集成 深入理解Autofac 指导 关于 词汇表 自动装配 从容器中可用 ...
- unity, destroy gameObject & destroy all children
一,destroy gameObject 删除名为xxx的gameObject 错误方法1: Destroy(xxx); 以上方法之所以错误,是因为Destroy在下一帧才生效,而在本帧之内xxx还存 ...