I'm doing fast click for mobile browser. When I fast click on link of current page, it does an ajax load to next page. My fast click script can stop the ghost click now. But if there is an input element on next page at click position on current page, it still get a focus and display virtual keyboard. How to prevent ghost focus event too?
To prevent actions related to an event, use .stopImmediatePropagation()
and preventDefault()
.
Working Demo
- stopImmediatePropagation() - Handlers within the same function where it is call, will be executed normally, but will immediately neglect/stop any actions within other functions related to the same event. For example:
// alert will fire
$(document).on('click', '#foo', function(event) {
event.stopImmediatePropagation();
alert('Hello world');
});
// but this will be stopped
$(document).on('click', '#foo', function(event) {
console.log('I am stopped!');
});
- preventDefault() - When called, default action will be neglected. For example
<a href="http://www.google.com" id="foo">Google it!</a>
The link will be halted, but an alert will fire
$(document).on('click', '#foo', function(event) {
event.preventDefault();
alert('I prefer MSN');
});
Both should be combined together in order to stop events from bubbling up the DOM tree.
I made a Demo to explain the differences between both and why both should be combined together.
Based on the above, your code should look like this.
$(document).on('click', '.selector', function (event) {
event.stopImmediatePropagation();
event.preventDefault();
});
I hope this helps.
I'm using fastclick.js. Here's my way to prevent auto trigger on next page:
Global CSS:
#preventClick { width:100%; height:100%; position:absolute; z-index:1000; top:0; left:0; }
HTML on next page:
<body>
<div id="preventClick"></div>
<!-- button on the same coordinate with previous page -->
</body>
Script on next page:
function onDeviceReady() {
setTimeout(function(){ $('#preventClick').hide(); }, 300);
}
300 is the minimum and no point putting more than that
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With