As many people already know, Safari is going to be the next Internet Explorer and needs more and more customizations to work as well as the other Browsers. In this case, i had a problem with Safari using the on click function of jQuery. Let’s come directly to the solution.
The following does not work for all Safari mobiles / tablets
$(document).on('click', '#anyHTMLelement', function(event) {
event.preventDefault();
// Some code to be executed after #anyHTMLelement is Touched or clicked
});
This will work well for all Safari mobiles / tablets
$(document).on('click touchend', '#anyHTMLelement', function(event) {
event.preventDefault();
// Some code to be executed after #anyHTMLelement is Touched or clicked
});
Instead of touchend you can use another trigger options too. Here you get a list with their names and when they are triggered according to MDN:
- touchstart
The touchstart event is fired when a touch point is placed on the touch surface. - touchend
The touchend event is fired when a touch point is removed from the touch surface. - touchmove
The touchmove event is fired when a touch point is moved along the touch surface. - touchcancel
The touchcancel event is fired when a touch point has been disrupted in an implementation-specific manner (for example, too many touch points are created).