当前位置: 首页 > 图文教程 > 网络编程 > Javascript > JS触发A标签的点击事件

Javascript
javascript 图片放大效果函数
javascript 随机抽奖程序代码
JavaScript 读取图片实例代码
JQuery toggle使用分析
jQuery html()等方法介绍
jquery中的$(document).ready()与window.onload的区别
JS获取dom 对象 ajax操作 读写cookie函数
ExtJS Window 最小化的一种方法
div移动 输入框不能输入的问题
js trim函数 去空格函数与正则集锦
js url传值中文乱码之解决之道
页面版文本框智能提示JS代码
ExtJS的FieldSet的column列布局
Jquery中增加参数与Json转换代码
ExtJS Grid使用SimpleStore、多选框的方法
javascript实现拖拽并替换网页块元素
javascript 设置文本框中焦点的位置
面向对象的编程思想在javascript中的运用上部
javascript call方法使用说明
javascript instanceof 与typeof使用说明

Javascript 中的 JS触发A标签的点击事件


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-28   浏览: 220 ::
收藏到网摘: n/a

问题:有一个列表,每一个条目都是这篇文章的部分内容,类似这样:

<div class="list">
<div class="item">
第一篇文章</div>
<div class="item">
第二篇文章</div>
.....</div>

而且在每个条目的div的右上角都有一个“评论”链接,点击就会展开所有的评论,并且显示评论框,这个链接的形式如下:

<a class="comment-mod" href="#">评论</a>

如果用户直接查看文章列表,那么所有的评论以及评论框都是不显示的,但是如果用户通过别的页面比如首页的个人动态直接定位到这篇日志,那么评论就应该全部显示。而列表页和查看单个条目的页面是同一个页面,这就要求我判断一下用户是否定位到该篇日志,如果是,就通过JS来触发 A 标签的点击事件。

一开始我尝试了一些方法,想当然地以为 A 标签和按钮一样是有 onclick() 事件的,结果发现没有,后来从网上搜了一些资料之后,成功解决了这个问题^_^ 。解决办法是针对 IE 和 FF编写不同的逻辑,部分代码如下:

var comment = document.getElementsByTagName('a')[0];
 
if (document.all) { // For IE 
 
comment.click();
} else if (document.createEvent) { //FOR DOM2
 
var ev = document.createEvent('MouseEvents'); ev.initEvent('click', false, true); comment.dispatchEvent(ev);
}

上面的代码在IE6, IE7 和 FireFox 3 下通过测试。

UPDATE: 测试的时候发现代码在FireFox 2下不好使,仔细检查之后发现了问题,把 document.createEvent(’HTMLEvents’) 改成 document.createEvent(’MouseEvents‘);就好了。(刚写完的时候唯独没有测试FireFox 2,结果还真是有问题,看来那句话说的对:如果你觉得可能会出问题,那就一定会出问题。

参考文章:表单Form的submit事件不响应