jquery.click() not working in iOS
HTML:
-
Try to add a pointer cursor to the button and use .on to bind the click event.
$('#button1').css('cursor','pointer');
$(document).on('click', '#button1', function(event) {
event.preventDefault();
alert('button1');
});
讨论(0)
-
The simplest solution to this issue is to just add cursor: pointer; to the style (CSS) of the element that you are targeting.
#button1 {
cursor: pointer;
}
Alternatively, this could be added inline:
<a class="button1 selected" id="button1" href="#" style="cursor: pointer;"><div class="icon"></div><div class="text">Option 1</div></a>
讨论(0)
-
I came across this:
http://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
In short, one of these conditions needs to be met for iOS browsers to generate click events from touch-events:
- The target element of the event is a link or a form field.
- The target element, or any of its ancestors up to but not including the
<body>, has an explicit event handler set for any of the mouse events. This event handler may be an empty function.
- The target element, or any of its ancestors up to and including the document has a cursor: pointer CSS declarations.
讨论(0)
-
A general solution might be something like this:
JS
const IS_IOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
if (IS_IOS) {
document.documentElement.classList.add('ios');
}
CSS
.ios,
.ios * {
// causes dom events events to be fired
cursor: pointer;
}
讨论(0)
-
Yacuzo's answer is the most exhaustive.
But I want to add the 4th trick (my favorite):
$('div:first').on('click', $.noop);
And it doesn't matter whether the first div is a parent of your target element or not!
讨论(0)
加载中...
- 热议问题