问一个 jQuery 的简单问题

2015-10-29 14:53:53 +08:00
 undef404
$(selector).click()
$(selector).trigger( "click" )
$(selector).on( "click", handler ) 
//这三个和
dom.click()
//有什么区别

<a href="/testtest/test.html"/>
$("a[href*='testtest']")[0].click()//直接访问该链接
$("a[href*='testtest']").click()//因为没有 onclick 所以没反应,也没访问链接
2452 次点击
所在节点    JavaScript
13 条回复
loading
2015-10-29 14:56:17 +08:00
浏览器事件
jquery 文档

麻烦你先去看看!
undef404
2015-10-29 15:00:22 +08:00
@loading 看了 jQuery 的文档,还是没搞清楚,$(selector).click()为什么不会触发 a href 的默认 click 事件,访问连接
YuJianrong
2015-10-29 15:41:18 +08:00
@undef404 jQuery 事件系统是 jQuery 内虚拟出来的(外部事件会被 jQuery 监听并转换成虚拟的内部事件),所以 .click() 并不会真的在 dom 对象上产生一个 click 事件,只是产生了一个虚拟事件,然后用 jquery 的 on("click")监听的事件才会被响应。

如果你要模拟真实的点击事件的话,要用原生方法:
xxx.dispatchEvent(new MouseEvent("click"));
这样。
yyfearth
2015-10-29 15:43:32 +08:00
@undef404 你这样调用 click 事件 只是调用你绑定在 click 上面的 functions 而已
不会调用浏览器本身的功能

要调用浏览器本身的功能需要用到 dispatchEvent
https://developer.mozilla.org/samples/domref/dispatchEvent.html
banri
2015-10-29 15:46:30 +08:00
jQuery 最后返回的是一个 jQuery 对象,而加上 [0] 之后会返回 DOM 节点

.click() 在 内部调用了 .on('click') 算是一种快捷方式

.on 方法是添加事件监听,也就是说,当你鼠标点击时,触发 xx 事件

而.trigger 是主动触发事件,比如.trigger('click') 就是主动触发了某元素上的点击事件,比如你可以设置网页一加载完成,就主动触发了点击某按钮
unknownservice
2015-10-29 15:46:39 +08:00
click 和 href 跳转是两个事件,而且执行先后跟浏览器还有关系。
调用 click 只会触发绑定在 click 上的事件,并不会真的模拟一个点击鼠标的操作。
over
banri
2015-10-29 15:50:53 +08:00
@banri 貌似不太对,应该说是

.click(function() {

})

内部调用了

.on('click',function() {

})
unknownservice
2015-10-29 15:53:02 +08:00
YuJianrong
2015-10-29 16:01:47 +08:00
@YuJianrong 哎呀之前写错了和虚拟事件无关……
jquery 的 trigger("click") 其实是在 dom 节点上调用了 element.click() 方法,这个方法不会做一些浏览器缺省行为(比如跳转),后者必须用 dispatchEvent 来做。
Moker
2015-10-29 16:24:03 +08:00
我举个前几天碰到的一个问题。
用 ajax 加载出来的 list 里面的 btn click()是无法直接触发 click 事件,而原来的 list 却可以
而换成 on(‘ click ’)就可以
abcfyk
2015-10-29 16:46:23 +08:00
@Moker 你说的和 LZ 提问的不是同一个问题。

你的问题属于 jQuery 对 DOM 元素 click 事件冒泡的捕获。

LZ 的问题是 jQuery 的 click 函数与 DOM 原生 click 事件的区别。
Moker
2015-10-29 17:20:04 +08:00
@abcfyk = =啊哦。。。
jugelizi
2015-10-29 21:53:48 +08:00
@Moker 本来就应该是 live 和 on 啊, live 好像要废弃的

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/232005

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX