我们常用的在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;"

我们常用的在a标签中有点击事件的更多相关文章

  1. a标签中有点击事件

    我们常用的在a标签中有点击事件:1. a href="javascript:js_method();" 这是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问题 ...

  2. 在js中拼接<a>标签,<a>标签中含有onclick事件,点击无法触发该事件

    我们在<a>标签中添加事件一般是onclick="editUser()" 这样添加,在html页面上是行的通的 但是如何你是在js中拼接<a>标签并在< ...

  3. WebView 实现JS效果和a标签的点击事件

    目前很多android app都可以显示web页面的界面,嵌入式开发,这个界面一般都是WebView这个控件加载出来的,学习该控件可以为你的app开发提升扩展性. 先说下WebView的一些优点: 可 ...

  4. 如何禁用 a 标签的点击事件

    a标签是没有disable属性的 ,如果想用disable 禁用a标签的点击事件,也可以实现: 1.a标签要用disable属性,必须和pointer-events属性一起使用, html代码: &l ...

  5. a标签添加点击事件

      a标签添加点击事件 CreateTime--2017年8月8日09:11:34 Author:Marydon 一.基础用法 方式一:(不推荐使用) <a href="javascr ...

  6. a标签绑定点击事件失败

    如图 然后对a标签绑定点击事件  无效 换成span标签可以

  7. a 标签中加 onclick事件,根据事件中的校验情况来决定是否执行a标签的链接

    a 标签中加 onclick方法后,先执行onclick方法,在去执行a标签href下属性对应的动作,如果不想执行href属性下动作需要用false作为返回值. <a href="ht ...

  8. img标签中的onerror事件

    img标签中有一个onerror事件.是当我引用的src属性获取不到图片或者网络错误导致无法正常显示我src属性的图片时,显示的提示错误图片或者是可以代替的万能图片. 用法: <img src= ...

  9. vue项目进行时,script标签中,methods事件中函数使用的async/await

    用 async/await 来处理异步 await关键字只能放到async函数里面,通过await得到就是Promise返回的内容:当然也能通过then()去获取,若通过then()获取了则就无Pro ...

随机推荐

  1. shell脚本中各个参数的意思

    文件表达式-e filename 如果 filename存在,则为真-d filename 如果 filename为目录,则为真 -f filename 如果 filename为常规文件,则为真-L ...

  2. HTML+JavaScript制作表白特效,表白不成功,小编现场吃雪

    今年的雪特别美,长沙自从08年后的最大的一场学了,今天小编给大家制作一个表白特效,希望大家喜欢,如果你是程序员希望对你有帮助,追到你喜欢的女孩,哈哈~追不到对象,小编现场吃学给你大家看 下图是爱心飘落 ...

  3. Guava源码学习(二)Ordering

    基于版本:Guava 22.0 Wiki:Ordering 0. Ordering简介 Guava的Ordering提供了链式风格的比较器的实现,我们可以用Ordering轻松构建复杂的比较器. 1. ...

  4. Hibernate 快速上手操作入门

    本文主要是从技术操作角度去介绍hibernate,并且简单描述如何快速的上手操作hibernate,用于作为与数据库的连接的持久层. 简单讲述一下hibernate究竟是什么,它有什么作用,在理解它的 ...

  5. (转)Ubuntu安装g++-4.8

    sudo add-apt-repository ppa:ubuntu-toolchain-r/test sudo apt-get update sudo apt-get install g++-4.8 ...

  6. create-react-app创建项目后运行npm run eject命令报错解决办法

    最近在用create-react-app创建项目,因要配置各种组件,比如babel,antd等, 需要运行npm run eject命令把项目的配置文件暴露出来,但是还是一如既然碰到报错,因为是在本地 ...

  7. bzoj2301(莫比乌斯反演)

    bzoj2301 题意 求区间 [a, b] 和 区间 [c, d] 有多少对数 (x, y) 使得 gcd(x, y) = k . 分析 参考ppt 参考blog 考虑用容斥分成四次查询, 对于每次 ...

  8. 第一个Mac程序——倒计时v1&v2

    先放效果图: 这是我第一次尝试在Mac平台下编程,之前学过几天IOS开发,一直在等MJ老师更新.闲下来不编程不舒服,给自己,也给老婆编了这个以提醒自己好好学习.v2版加入了各种倒计时.改进了界面.把倒 ...

  9. Apache+php+mysql的安装与配置 - 之三(Apache的虚拟主机配置)

    Apache+php+mysql的安装与配置 - 之三(Apache的虚拟主机配置) Apache核心(Core)配置 VirtualHost 语法 <VirtualHost addr[:por ...

  10. 联想台式机启天m4350 启用intel vt-x

    在vmware workstations10 64位上安装windows server 2012操作系统时,出现例如以下错误: 已将该虚拟机配置为使用 64 位客户机操作系统.可是,无法运行 64 位 ...