Javascript和jquery事件--点击事件和触发超链接

时间:2024-03-07 07:27:31

前面的不过是一些基础的知识,真正的一些事件还是有点不同。还有一些命名空间的问题。不过现在ie也开始接受W3C标准,而且平时开发也很少考虑ie了,一些事件就不考虑ie了。

点击事件--click

  大部分问题出现在js、jq触发超链接上面。我之前看到的解释是谷歌新版本阻止了触发浏览器默认的操作(超链接、右键等等),但是在下面参考的一篇文章又提出是因为要触发超链接点击的不是<a>元素,而是<a>元素里面的内容,我觉得比较靠谱,因为网上不少jq有关操作做的都是相关的改变,但是这个方法在js中无用,大致的方法有如下几种。

在Js中:

    a)  无法触发超链接,只触发了给a标签绑定的’click’监听器(标准方法)

var evt = document.createEvent( \'HTMLEvents\' );

evt.initEvent(\'click\', true, true);

document.getElementById(\'test\').dispatchEvent(evt);//无法触发超链接a

 

    b)  给a标签里面添加了一个空的<span></span>,然后使用相同方法不可以触发

document.getElementById(\'test\').childNodes[0].dispatchEvent(evt);//无法触发超链接a

 

    c) 使用MouseEvent可以触发,不太清楚MouseEvents和event的区别。

var event = document.createEvent(\'MouseEvents\');

event.initMouseEvent(\'click\', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);

document.getElementById(\'test\').dispatchEvent(event);//可以触发超链接a

    

    d) 使用click()可以触发,这个我是真的不明白了,网上也还没有查到更多的解释,无论在js还是jq,好像它就理所当然地可以代替addEventListener进行监听器绑定,然而又区别于onclick,然后又理所当然地可以替代dispatchEvent()进行事件触发,而且不受是不是超链接限制。我之前用的最多的也是它,也有一些与它相似的事件,大概都出现在表单元素中,到时候再统一看看。

document.getElementById(\'test\').click();//可以触发超链接a

在jq中:

    a) 无法触发超链接,只触发了给a标签绑定的’click’监听器(标准方法)

$(\'#test\').trigger(\'click\');//无法触发超链接a

 

    b) 给a标签里面添加了一个空的<span></span>,然后使用相同方法可以触发

$(\'#test span\').trigger(\'click\');//可以触发超链接a

 

  c) 依旧是click()触发,不过除了js中的疑问,又多了一个疑问。由于之前所说是点击内容触发,$(‘#test’).click();不能触发,$(‘#test’)[0].click()能触发,即使#test对应的a标签没有子元素我都能理解。但是我依稀记得引发我对超链接思考的事故就发生在$a[0].click()失效啊。

我回去看了一下,下面的一段代码在http访问火狐浏览器的确是无效的,我也不知道为什么,反正就是不能用。

        

var $a = $("<a></a>").attr("href", \'worker.js\').attr(\'target\',\'_blank\');

 $a[0].click();//在火狐浏览器中通过http访问时无效

 

参考:

http://www.cnblogs.com/kevinge/p/4803786.html

https://smartblack.iteye.com/blog/608477