jqueryMobile tap and bubbling/propagation

Question

See this sample in android 2.x browser..its a sample to replicate a scenario in my application..

http://johnchacko.net/samples/tap.html

Its about listening to 'tap' and calling changePage from listener...

The second page is having some input fields, 'tap' event is bubbling/propagating to second page and focus is randomly set to input fields...

I read similar issues and want to know anybody experienced same issue and got a workaround for it....

Or I must use only 'click' ?

Answer 1

It can be fixed in few ways:

1. On tap/click event use this methods before you call changePage:

   e.stopPropagation();
   e.stopImmediatePropagation();
   

   or:

   $(document).on('tap', '#button', function(){       
       e.stopPropagation();
       e.stopImmediatePropagation();
       // Rest of the code
   });
   

2. Initialy disable all input boxes on a second page, on a pageshow event use settimeout function and enable them after cca 10 ms