a标签调用js的几种方法
我们常用的在a标签中有点击事件:
<a> 标签的 href 属性用于指定超链接目标的 URL,href 属性的值可以是任何有效文档的相对或绝对 URL,包括片段标识符和 JavaScript 代码段。
这里的href="javascript:;",其中javascript:是伪协议,它可以让我们通过一个链接来调用javascript函数.而采用这个方式 javascript:;可以实现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的作用。所以用这种方法点击后网页后返回到页面的最顶端。
<a href="#"></a> 如果页面有滚动条 点击后网页后返回到页面的最顶端
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 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标签调用js的几种方法的更多相关文章
- a 标签中调用js的几种方法 文章摘自他人
我们常用的在a标签中有点击事件:1. a href="javascript:js_method();" 这是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问题 ...
- a 标签中调用js的几种方法
我们常用的在a标签中有点击事件: 1. a href="javascript:js_method();" 这是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问 ...
- a标签中调用js的几种方法
1. a href="javascript:js_method();" 这是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而且javascript:协议 ...
- [转]html里a标签中href调用js的几种方法
文章转自:https://blog.csdn.net/best_luxi/article/details/45062301 我们常用的在a标签中有点击事件: 1. a href=”javascript ...
- a 中调用js的几种方法
我们常用的在a标签中有点击事件:1. a href="javascript:js_method();" 这是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问题 ...
- HTML5结合CSS的三种方法+结合JS的三种方法
HTML5+CSS: HTML中应用CSS的三种方法 一.内联 内联样式通过style属性直接套进HTML中去. 示例代码 <pstylepstyle="color:red" ...
- js,JavaScript,a标签onclick传递参数不对,A标签调用js函数写法总结
错误示例: <a href="javascript:waterLineEdit(${goods.goods_id})" >修改 </a> <!-- 浏 ...
- C++调用DLL有两种方法——静态调用和动态调用
C++调用DLL有两种方法——静态调用和动态调用 标签: dllc++winapinullc 2011-09-09 09:49 11609人阅读 评论(0) 收藏 举报 分类: cpp(30) [ ...
- 最全总结!聊聊 Python 调用 JS 的几种方式
1. 前言 很多人学习python,不知道从何学起.很多人学习python,掌握了基本语法过后,不知道在哪里寻找案例上手.很多已经做案例的人,却不知道如何去学习更加高深的知识.那么针对这三类人,我给大 ...
随机推荐
- zepto源码研究 - ajax.js(请求过程中的各个事件分析)
简要:ajax请求具有能够触发各类事件的功能,包括:触发全局事件,请求发送前事件,请求开始事件,请求结束事件等等,贯穿整个ajax请求过程,这是非常有用的,我们可以利用这些事件来做一些非常有意思的事情 ...
- java Byte.toString 方法与String.ValueOf(Byte)效率比较
int times = 10000000; Byte[] li = new Byte[times]; for (int i = 0; i < times; i++) { li[i] = (byt ...
- 武汉科技大学ACM:1005: 单位转换
Problem Description BobLee最近在复习考研,在复习计算 机组成原理的时候,遇到了一个问题.就是在计算机存储里面的单位转换.我们都知道1MB=1024KB,1KB=1024B,1 ...
- QQ登录api
<?php namespace Api\Member; class QQConnect{ /** * 获取QQconnect Login 跳转到的地址值 * @return array 返回包含 ...
- Nginx并发访问优化
Nginx反向代理并发能力的强弱,直接影响到系统的稳定性.安装Nginx过程,默认配置并不涉及到过多的并发参数,作为产品运行,不得不考虑这些因素.Nginx作为产品运行,官方建议部署到Linux64位 ...
- PHP备份数据库的原理和方法 57
1.PHP备份数据库的原理查找所有表--查找所有字段(需要列出所有字段名, 字段类型等相关信 息)---查找所有数据(读取数据出来注意 特殊符号的转换 addslashes ())--生成SQL(把数 ...
- 『邪恶のWIFI』搭建假冒WIFI热点等女神来蹭网啊 - -。
pic by baidu 0x 00 ╮(╯▽╰)╭ 请喊我万恶的标题党 哈哈哈哈哈 0x 01 这里正题 虚拟机(Kali)不支持内置网卡,还好我有神器,插上我的RT8187L,开始搞起 参考资料 ...
- d3可视化实战04:事件绑定机制
首先说明,d3支持所有的JS事件——甚至其他代码的自定义事件.这里有一个列表,The MDN Event Reference, 包含了几乎所有浏览器创建的事件类型.大家有需要可以去查看. D3的事件绑 ...
- ESSENTIAL ENGLISH SLANG
airhead: stupid person. ace: excellent, great. Adam and Eve - Rhyming Slang for 'believe'. aggro - s ...
- 转 Jona Dany 一个20年架构师程序员的经验总结
1.估算问题解决所需要的时间,为自己定一个时间限制,1小时,30分钟,15分钟.如果这期间不能解决问题,那就去寻求帮助.不要做超级堆码员. 2.编程语言是一种语言,只是一种语言.只要理解一种语言的原理 ...