分针网—每日推荐: A标签中的点击事件

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

转载:http://blog.163.com/feitian_com/blog/static/1952733820127316502581/

想学习更多IT知识可加群:272292492

时间: 2024-08-25 16:04:44

分针网—每日推荐: A标签中的点击事件的相关文章

关于在"a"标签中添加点击事件的一些问题

昨天做修改页面跳转时遇到一个问题,如果a标签的"href"属性为空的话,比如这样<a href="" onclick="roleupdate()">修改</a>,这时当我点击修改链接时并没有给我跳到对应修改页面,而是只在本页面进行了刷新操作:如果写成<input type="button" onclick="roledelete()" value="修改"&

分针网—每日分享: 怎么轻松学习JavaScript

js给初学者的印象总是那么的"杂而乱",相信很多初学者都在找轻松学习js的途径. 我试着总结自己学习多年js的经验,希望能给后来的学习者探索出一条"轻松学习js之路". js给人那种感觉的原因多半是因为它如下的特点: A:本身知识很抽象.晦涩难懂,如:闭包.内置对象.DOM. B:本身内容很多,如函数库,对象库就一大堆. C:混合多种编程思想. 它里面不但牵涉面向过程编程思想,又有面向对象编程思想,同时,它的面向对象还和别的编程语言(如:C++,JAVA,PHP)不

分针网—每日分享: 根据屏幕大小,加载不同大小的图片

引言 今天要介绍的东西,很简单,但是对于前端响应式的时候是个很重要的知识: 我们在用bootstrap这类前端框架时, 虽然页面局部通过media query实现了,页面始终无滚动条,响应式页面. 但是,bootstrap里面的img-responsive类只是通过设置图片100%, 并没有真正的实现在手机上和电脑端加载不同大小的图片. 代码其实很简单 <!DOCTYPE html> <html lang="en"> <head> <meta 

分针网—每日分享:说一说 React 和 Redux 你知道或者不知道的一些事情

本文介绍一下自己在使用React和Redux过程中的一些思考,主要面向初学者. 1. 为什么要有redux 传统前端开发中,把模板和功能逻辑分开作为一种最佳实践,React采用了不同的思路,通过组件把模板和逻辑组合在一起.但是React也并不是一个完整的组件化框架,其组件化只是主要集中在展示层面,如果要构建复杂的应用,在React component中放置太多的逻辑代码,不仅组件化的初衷复用性会降低,从代码维护的角度看也不合理. Flux是Facebook提出的一种前端架构模式,通过Flux的数

分针网——每日分享: jquery选择器的用法

jQuery选择器是jQuery库的一大特色,用这些选择器不但可以省去繁琐的JavaScript 书写方式,还可以节省时间和效率,正是有这些jQuery选择器,才让我们更容易的操作JavaScript的dom. 1. 基本选择器 ·#id 根据给定的ID匹配一个元素.例如:$("#id") ·element 根据给定的元素名匹配所有元素.例如:$("div") ·.class 根据给定的类匹配元素.例如:$(".style1"); ·* 匹配所有

分针网—每日分享:js刷新页面方法大全

如何实现刷新当前页面呢?借助js你将无所不能. 1,reload 方法,该方法强迫浏览器刷新当前页面. 语法:location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页.true, 则以 GET 方式,从服务端取最新的页面, 相当于客户端点击 F5("刷新") 2,replace 方法,该方法通过指定URL替换当前缓存在历史里(客户端)的项目,因此当使用replace方法之后,你不能通过"前进

a标签中的点击事件

我们常用的在a标签中有点击事件:1. a href="javascript:js_method();" 这 是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而且javascript:协议作为a的href属性的时候不仅会导致不必要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放.W3C标准不推荐在href里面执行 javascript语句 2. a href="javascript:void(0);&quo

分针网—每日分享:PHP开发几点安全问题

领取免费IT学习资料 加群:272292492 php给了开发者极大的灵活性,但是这也为安全问题带来了潜在的隐患,近期需要总结一下以往的问题,在这里借翻译一篇文章同时加上自己开发的一些感触总结一下. 简介 当开发一个互联网服务的时候,必须时刻牢记安全观念,并在开发的代码中体现.PHP脚本语言对安全问题并不关心,特别是对大多数没有经验的开发者来说.每当你讲任何涉及到钱财事务等交易问题时,需要特别注意安全问题的考虑,例如开发一个论坛或者是一个购物车等. 安全保护一般性要点 不相信表单 对于一般的Ja

分针网—每日分享:mongoose对查询结果进行排序

http://www.fenzhen.cc/id/177 前面的学习已经可以刷出数据了,不过通过循环取出来后,发现并不是按照想象中的按先后顺序列出来的,而是按照数据在数据库中存放的顺序刷出来的. 如图,MongoDB存储数据并没有按照我添加数据的先后顺序,而是按照了author这个字段来的,因此前台刷出的数据也是安装author来的. 那么如何让前台通过时间来排序呢? 解决方法如下: MyModel.find(condition, fields, {sort: [['_id', -1]]}, c