问题
In my html/js/css app, inside $(document).ready(function)
I have the following code (copy-paste, verbatim):
$(document).on('mousedown touchstart', '.button', function() {
if(!$(this).hasClass('button-disabled')) {
$(this).addClass('button-hover');
}
}).on('mouseup touchend', '.button', function() {
$(this).removeClass('button-hover');
});
The idea is to highlight buttons on mousedown or touchstart and remove the highlight on mouseup and touchend. This works perfectly fine on desktop (osx, linux and windows) in all browsers. This also works perfectly fine on Android (touch screen) and on iPhone 5S (I only have this model). However on iPad, the hover class is being added correctly, yet it's not being removed. When I debug the app on ipad using safari and put a breakpoint on line $(this).removeClass('button-hover');
that breakpoint is never triggered.
Assigning events to each button individually is not an option, as there are literally hundreds of places in the app wherebuttons are created and destroyed dynamically as the app is running.
Unfortunately, the app is for a client that only uses it on an ipad - the app is explicitly designed for internal company use on ipads - so ignoring an issue on ipad isn't an option. I tried to convince the client to forgo the highlighting - they refused and stated that it's critical to have it in the app.
Short of a it being a bug in safari on ipad, I can't think of any reason why this would be happening. Any suggestions would be greatly appreciated.
回答1:
Ok, this wasn't strictly a bug, but rather a difference in behaviour between safari on ipad and other browsers/platforms.
In another place in the app, I had
$(document).on('mouseup touchend', '.button', function(e) {
... //some other code
e.stopPropagation();
e.preventDefault();
});
I am guessing safari was executing this handler first and either stopPropagation
or preventDefault
on the event was causing it to not execute the next one in the chain. I am surprised that this only affected safari on ipad and even on iphone everything worked correctly.
来源:https://stackoverflow.com/questions/34754826/touchend-not-triggered-on-ipad-only