html - 如何区分点击是真实的点击还是JavaScript触发的点击?
巴扎黑
巴扎黑 2017-04-10 14:52:18
0
3
623

在有的网站直接用jQuery在命令行选中一个元素,比如一个可以点击的登录按钮之类的,运行

$(selector).eq(n).click();

发现不起作用,有的网站则可以起作用。

我本来以为是在点击的时候同事判断鼠标是不是在这个元素上面,后来发现似乎不是这样做的。

然后我发现把之前的触发方式变成

$(selector)[n].click();

也就是换成原生的click方法就可以触发了。

我就猜测是不是那些网站对jQuery的click做了处理呢?

有没有办法判断是真实的点击还是JavaScript触发的点击?

巴扎黑
巴扎黑

reply all(3)
黄舟

=_=! 从问题上来看你已经钻牛角尖钻到一个相当蹩脚的地方去了,那么问题来了,你蛋疼么...

好吧,不开玩笑说正经的啦。jQuery 的 .click() 别看它叫点击,可是它干的不纯粹是点击的事情。要了解这个我们还是得老老实实的翻文档,那么文档上是这么说的:

This method is a shortcut for .on( "click", handler ) in the first two variations, and .trigger( "click" ) in the third. The click event is sent to an element when the mouse pointer is over the element, and the mouse button is pressed and released. Any HTML element can receive this event.

.click() 函数有无参,一个参数和两个参数三种情况。文章中明确指出了,一参和两参的情况下就相当于 .on("click", fn) 的简写。也就是说,其实 jQuery 干的只是为元素绑定了一个点击事件,并触发这个点击事件而已。而无参的情况下就相当于 .trigger("click"),也就是说直接触发点击事件。所以, jQuery 的 .click() 都是围绕着事件来的。那么当元素没有定义事件呢?抱歉,jQuery 的 .click() 罢工了。

文字上可能不太好明白,但是来个例子对比一下你就能懂了:http://jsfiddle.net/gp1qu8co/ 。 这个例子的结果是通过事件绑定的 alert 弹出来了,但是链接却没有跳转。那到底为啥默认事件没有触发,而用户自定义的事件触发了呢?让我们继续来看一个例子:http://jsfiddle.net/gp1qu8co/1/ 。测试发现通过原生的 .addEventListener() 注册的事件也不能被触发。啊咧还有这种区别么?前面说过了,无参的情况就是 .trigger("click") 的简写,所以为了搞明白这个问题,我又去看了.trigger() 的文档,文档中是这么说的:

Any event handlers attached with .on() or one of its shortcut methods are triggered when the corresponding event occurs.

原来 .trigger() 只会触发通过 .on() 和其方法的简写(比如 jQuery 的 .click())绑定的事件啊!所以我们明白了,原来 jQuery 的 .click() 只是 jQuery 的,并不是大家的啊。

以上千言万语就是一句话,触发点击事件的话还是用原生 .click() 的好,原生也很美!

大家讲道理

http://stackoverflow.com/questions/7635274/how-to-detect-if-a-click-is-a-mouse-click-or-triggered-by-some-code

http://stackoverflow.com/questions/14794380/detect-if-button-click-real-user-or-triggered-by-a-script

http://stackoverflow.com/questions/6674669/in-jquery-how-can-i-tell-between-a-programatic-and-user-click

綜上,jquery 的 trigger click 和原生 .click() 的區別是有無 originalEvent

而 programatic 和 user click 的區別是 e.which 以及坐標。

公子大大說得好,無 originalEvent 的原因是 jquery 的 trigger click 根本就沒有調用原生的方法,只侷限在 jquery 自己的體系裏。

所以 題主的情況 1 可能是 檢查了 originalEvent 2 可能是直接用的 addEventListener。

阿神

$element.trigger('click')呢?

Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template