a标签的href与onclick事件的区别详解


Posted in Javascript onNovember 12, 2014

onclick中javascript的区别一般没用到都没注意,但出错时才有些郁闷,看文本章解释如下:

以前一直很随意,后来看.net里的linkbutton似乎是用在<a href="javascript:fun();"...>的形式,今天用这种方式就遇到一些问题,摘网友的文章和我的结论放在下面:

1.链接的 onclick 事件被先执行,其次是 href 属性下的动作(页面跳转,或 javascript 伪链接);
2.假设链接中同时存在 href 与 onclick,如果想让 href 属性下的动作不执行,onclick 必须得到一个 false 的返回值。不信,你可以将 goGoogle 函数中的 return false 注释掉;
3.如果页面过长有滚动条,且希望通过链接的 onclick 事件执行操作。应将它的 href 属性设为 javascript:void(0);,而不要是 #,这可以防止不必要的页面跳动;
4.如果在链接的 href 属性中调用一个有返回值的函数,当前页面的内容将被此函数的返回值代替;
5.在按住Shift键的情况下会有所区别。
6.今天我遇到的问题,在IE6.0里以href的形式访问不到parentNode。
7.尽量不要用javascript:协议做为A的href属性,这样不仅会导致不必要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放。
就这些,花了不少时间在这上面。

[缘由]
用CheckBoxList控件时想实现在每个checkbox后再加链接的功能,点链接实现一些功能之外,还要把checkbox选中。

<input type="checkbox" name="chk" id="chk">
<label for="chk">选中它<a onclick="this.parentNode.click();" href="#" style="border:solid 1px blue;">[label中的链接]</a></label>

最后用parentNode来实现的。

<a href="javascript:void(0)" onclick="defineField(this);return false">ClickToDefine</a>

Javascript 相关文章推荐
动态修改DOM 里面的 id 属性的弊端分析
Sep 03 Javascript
js parseInt(&quot;08&quot;)未指定进位制问题
Jun 19 Javascript
一次失败的jQuery优化尝试小结
Feb 06 Javascript
JS Range HTML文档/文字内容选中、库及应用介绍
May 12 Javascript
jquery blockUI 遮罩不能消失与不能提交的解决方法
Sep 17 Javascript
基于jquery的文本框与autocomplete结合使用(asp.net+json)
May 30 Javascript
jQuery插件Tooltipster实现漂亮的工具提示
Apr 12 Javascript
JS实现网页标题随机显示名人名言的方法
Nov 03 Javascript
JavaScript判断图片是否已经加载完毕的方法汇总
Feb 05 Javascript
浅谈JavaScript的push(),pop(),concat()方法
Jun 03 Javascript
vue实现tab切换外加样式切换方法
Mar 16 Javascript
JavaScript 中的执行上下文和执行栈实例讲解
Feb 25 Javascript
完美兼容各大浏览器的jQuery仿新浪图文淡入淡出间歇滚动特效
Nov 12 #Javascript
JavaScript实现关键字高亮功能
Nov 12 #Javascript
javascript的函数作用域
Nov 12 #Javascript
浅析javascript的间隔调用和延时调用
Nov 12 #Javascript
jQuery的deferred对象详解
Nov 12 #Javascript
探寻Javascript执行效率问题
Nov 12 #Javascript
推荐8款jQuery轻量级树形Tree插件
Nov 12 #Javascript
You might like
PHP 上传文件大小限制
2009/07/05 PHP
第三章 php操作符与控制结构代码
2011/12/30 PHP
PHP设计模式 注册表模式
2012/02/05 PHP
php获取qq用户昵称和在线状态(实例分析)
2013/10/27 PHP
php生成excel文件的简单方法
2014/02/08 PHP
yii框架builder、update、delete使用方法
2014/04/30 PHP
php中filter_input函数用法分析
2014/11/15 PHP
28个JS验证函数收集
2010/03/02 Javascript
基于JQuery的6个Tab选项卡插件
2010/09/03 Javascript
详谈jQuery操纵DOM元素属性 attr()和removeAtrr()方法
2015/01/22 Javascript
JS使用cookie设置样式的方法
2016/06/30 Javascript
关于JavaScript数组你所不知道的3件事
2016/08/24 Javascript
浅谈react.js 之 批量添加与删除功能
2017/04/17 Javascript
bootstrap fileinput实现文件上传功能
2017/08/23 Javascript
jQuery选择器中的特殊符号处理方法
2017/09/08 jQuery
vue实现日历备忘录功能
2020/09/24 Javascript
使用Vue CLI创建typescript项目的方法
2019/08/09 Javascript
layui实现tab的添加拒绝重复的方法
2019/09/04 Javascript
全面解析Vue中的$nextTick
2020/12/24 Vue.js
python批量修改文件编码格式的方法
2018/05/31 Python
使用Python快速搭建HTTP服务和文件共享服务的实例讲解
2018/06/04 Python
Python yield的用法实例分析
2020/03/06 Python
python 基于opencv实现图像增强
2020/12/23 Python
Jupyter Notebook 安装配置与使用详解
2021/01/06 Python
be2台湾单身男女交友:全球网路婚姻介绍的领导品牌
2019/10/11 全球购物
保加利亚服装和鞋类购物网站:Bibloo.bg
2020/11/08 全球购物
error和exception有什么区别
2012/10/02 面试题
介绍Ibatis的核心类
2013/11/18 面试题
医学专业本科毕业生自我鉴定
2013/12/28 职场文书
《小小竹排画中游》教学反思
2014/02/26 职场文书
物业保安员岗位职责
2014/03/14 职场文书
政府领导干部个人对照检查材料思想汇报
2014/09/24 职场文书
2014年新农村建设工作总结
2014/12/01 职场文书
长江七号观后感
2015/06/11 职场文书
商务宴会祝酒词
2015/08/11 职场文书
matplotlib之pyplot模块实现添加子图subplot的使用
2021/04/25 Python