jQuery mobile tap event triggered for twice jQuery mobile tap event triggered for twice jquery jquery

jQuery mobile tap event triggered for twice


I forget where I saw this, but the issue is that jQuery Mobile is binding to both touch and mouse events in order to simulate "tap," and in some circumstances Android will fire both.

The trick that has worked for me is to call preventDefault on the event in your event handler. That will keep the duplicate event from firing.

As far as why this is the case only sometimes, I know that mobile browsers will try to only fire the mouse version of the event if someone isn't listening to the touch version. There may be an issue with detection or jQuery's delegation that is confusing that heuristic.


You are experiencing the ghost click issue... It's a known "bug" and hard to resolve.

More infos there :

http://forum.jquery.com/topic/tap-fires-twice-with-live-taphttps://developers.google.com/mobile/articles/fast_buttonshttp://philosopherdeveloper.wordpress.com/2011/11/01/ghost-clicks-in-jquery-mobile/

In the first link you will find a hack that does the trick. As far as I know, there is no easy solution :(

BTW: Even if it won't solve your problem, @Sagiv is right. JQuery mobile often use ajax for changing page and so does not trigger a document.ready event.


from the jQuery Mobile page:

Important: Use $(document).bind('pageinit'), not $(document).ready()
The first thing you learn in jQuery is to call code inside the $(document).ready() function so everything will execute as soon as the DOM is loaded. However, in jQuery Mobile, Ajax is used to load the contents of each page into the DOM as you navigate, and the DOM ready handler only executes for the first page. To execute code whenever a new page is loaded and created, you can bind to the pageinit event. This event is explained in detail at the bottom of this page.

so skip the $(document).ready(). more info here.