touchend not triggered on ipad only

天涯浪子 提交于 2020-01-17 08:54:27

问题


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

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!