a标签加入单击事件 屏蔽href跳转页面
我们常用的在a标签中有点击事件:
1. a href="javascript:js_method();"
这是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而且javascript:协议作为a的href属性的时候不仅会导致不必要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放。W3C标准不推荐在href里面执行javascript语句
2. a href="javascript:void(0);" onclick="js_method()"
这种方法是很多网站最常用的方法,也是最周全的方法,onclick方法负责执行js函数,而void是一个操作符,void(0)返回undefined,地址不发生跳转。而且这种方法不会像第一种方法一样直接将js方法暴露在浏览器的状态栏。
3.a href="javascript:;" onclick="js_method()"
这种方法跟跟2种类似,区别只是执行了一条空的js代码。
4.a href="#" onclick="js_method()"
这种方法也是网上很常见的代码,#是标签内置的一个方法,代表top的作用。所以用这种方法点击后网页后返回到页面的最顶端。
5.a href="#" onclick="js_method();return false;"
这种方法点击执行了js函数后return false,页面不发生跳转,执行后还是在页面的当前位置。
我看了下taobao的主页,他们采用的是第2种方法,而alibaba的主页是采用的第1种方法,和我们的区别是每个href里的javascript方法都用try、catch包围。
综合上述,在a中调用js函数最适当的方法推荐使用:
个人推荐第二种:
a href="javascript:void(0);" onclick="js_method()"
a href="javascript:;" onclick="js_method()"
a href="#" onclick="js_method();return false;"
原博客:huang_qy
http://blog.163.com/huang_qy/blog/static/615601452012101411625600
侵权删
a标签加入单击事件 屏蔽href跳转页面的更多相关文章
- 使用location.href跳转页面在火狐浏览器中报错404
HTML文件中引入外部js文件,在该js文件里用window.location.href跳转相对路径下的html地址,火狐浏览器会报错404,而谷歌浏览器却显示正常·,分析了一下原因:在识别相对路径时 ...
- a标签屏蔽href跳转
原文地址: http://blog.163.com/huang_qy/blog/static/615601452012101411625600/ 推荐的写法: a href="javascr ...
- jQuery触发a标签点击事件-为什么不跳转
今天开发发现 使用jQuery触发a标签的点击事件,当前的样式发生了变化,可是没有跳转,为什么? 百度后找到的解决方案: <a onclick="hanle()" href= ...
- A标签添加JS事件,不跳转不刷新办法
<a href="javascript:;" id="submit-btn" class="submit-btn" title=&qu ...
- android map高德地图显示多个点,并且每个marker点可以响应鼠标点击事件,处理跳转页面
定义一个数组,然后将要显示的markers放进数组里面,让后循环每个marke对象,赋予监听事件,在监听事件里面写其它需要的功能: js举例: var arr = new Arry(); var ma ...
- a标签的click事件问题
easy知识点, a标签的click事件和href共存会在执行click事件后触发href里面的链接,如果把href设为空字符串:href="",则会使用当前页面的url作为跳转链 ...
- 如何给a标签绑定ajax事件
<a href="review?action=delete&id=${review.id}&articleId=${review.articleId}"cla ...
- a 标签添加 onclick 事件
a 标签添加 onclick 事件 <a href="javascript:void(0);" οnclick="js_method()">点击&l ...
- location.href跳转不正确
今天写这个随笔的用意是为了记录我遇到的一种情况,导致我页面无法正确跳转 location.href跳转页面其实很简单,只要附上url就可以了,但是今天我在测试一个跳转时是这么写的: location. ...
随机推荐
- 聊一下C#开发者如何过渡到JAVA 开发者
由于工作需要,最近也开始倒腾Java了.NET的话,从2012年测试版开始玩的,那个时候VB6比较熟悉,还天真的以为VB.NET以后会很火, 事实证明,也只是一厢情愿,有C#了,要VB.NET干什么? ...
- Java项目打包部署war文件
1.选中要打包的项目,右键单击,选择“Export-->WAR File”,在弹出的对话框中选择Destination.Server runtime等选项,点击Finish: 2.可以看到指定目 ...
- 【算法和数据结构】_12_小算法_abs_fabsf_fabsd_大端小端判断
最近学习要用到求绝对值函数,看了一下有很多种的abs函数,因此想自己实现这些代码. 下面是我进行测试的代码: #include <stdio.h> typedef unsigned int ...
- 51Node 1483----化学变换(暴力枚举)
51Node 1483----化学变换 有n种不同的化学试剂.第i种有ai升.每次实验都要把所有的化学试剂混在一起,但是这些试剂的量一定要相等.所以现在的首要任务是把这些化学试剂的量弄成相等. 有两 ...
- MAC 卸载 openfire
顺序执行以下命令: sudo rm -rf /Library/PreferencePanes/Openfire.prefPane sudo rm -rf /usr/local/openfire
- 七个结构模式之代理模式(Proxy Pattern)
定义: 给某一个对象提供一个代理或者占位符,并由代理类来控制对原对象的访问.代理对象在客户端和实际对象之间启到了中介作用,并且强调了代理类对原对象的控制作用.例如:安全代理.缓冲代理.远程代理等. 结 ...
- Struts2与Struts的区别
Struts2与Struts的区别 从Struts2的发展过程来看,Struts2继承了Struts与WebWork的血脉,Struts2取两者之精华,形成新德框架,但是struts2还是更多的继承了 ...
- 玩转Docker之常用命令篇(三)
首先我们来解决一个小问题,使用docker每次都要用sudo,为了让非root用户使用docker,可将当前用户添加到docker用户组: sudo groupadd docker sudo gpas ...
- Bootstrap源码分析之transition、affix
一.Transition(过滤) 作为一个基础支持的组件,被其他组件多次引用.实现根据浏览器支持transition的能力,然后绑定动画的结束事件:首先:创建一个Element:然后:迭代查看此元素支 ...
- localForage——轻松实现 Web 离线存储
Web 应用程序有离线功能,如保存大量数据集和二进制文件.你甚至可以做缓存 MP3 文件这样的事情.浏览器技术可以保存离线数据和大量的储存.但问题是,如何选择合适技术,如何方便灵活的实现. 如果你需要 ...