I was recently working on a page that had some existing transitions that happened when a user clicked on an item. My thought was to periodically trigger a click event that would automate the process some what, allowing me to take advantage of the existing transition code.
jQuery has a nifty method called .trigger that takes care of firing the click event for me. Very handy, but then I quickly realized that I needed to be able to tell the difference between a human click event and a .trigger‘d click event.
Fortunately I wasn’t the only one to have run into this issue and there is a solution described at http://stackoverflow.com/questions/6692031/check-if-event-is-triggered-by-a-human/6692173#6692173. The key is event.originalEvent, here is an example from the StackOverflow post:
[sourcecode lang=”javascript”]
$( "#click-me" ).click( function( event ) {
if ( event.originalEvent === undefined ) {
alert( ‘not human’ )
} else {
alert( ‘human’ );
}
} );
[/sourcecode]
You can also try it out on jsFiddle – http://jsfiddle.net/Uf8Wv/
This appears to be specific to jQuery, which in this case wasn’t a big deal since all of the other code on the page was using jQuery as well. The Event object documentation mentions event.originalEvent, but doesn’t indicate that it can be used in this way.
7 replies on “Difference Between A Human Click And A Trigger Click With jQuery”
I was thinking, it’s possible to use this code to automatic click on facebook “like” button ?
Regards,
FazerSiteGratis.
I suppose as long as the Javascript was running in the same context as the like button it could.
Thanxs – help a lot 😉
This really really helped me man! Nice! Thank you!
this is so great!!!! Thank you so much 🙂 I had some tough logic and i found myself creating a bunch of variables to keep track of the “enter” flow and the “next button human click” flow. This made my life so much easier!!!! Appreciate the help 😀
It may sound stupid but I wanted to go ahead and update the event object in javascript like this:
event.originalEvent = ‘click’ or anything else.
Has anyone found a work around to that?
What I am trying to achieve:
I have been tasked with automating 13 clicks on a page and the way that I am doing this is by pasting a bunch of javascript on that page’s console to simulate clicks.
It was worked perfectly for 12 of the buttons, but the 13th button behaved in a weird way. It would only submit if I clicked it via my actual mouse and not with javascript. Now I don’t have access to that page’s code, else I would have changed things directly.
On more research( i.e your blog and other SO Pages) I found out that there is something known as orginalEvent which is undefined.
I want a way to change that considering my current limitations.
Please provide your thoughts if you can help! 🙂
Really Helpful. Thank you so much