Событие touchend в ios webkit не запускается?

Я пытаюсь реализовать меню для приложения на основе ios webkit, в котором пользователь касается / щелкает и удерживает кнопку меню ('.menu_item'), через 500 мс открывается подменю (div.slide_up_sub_menu), и пользователь должен быть может провести пальцем / мышью до элемента подменю и отпустить.

    <li class="menu_item">
       ASSET MANAGEMENT
       <div class="slide_up_sub_menu hidden_menu">
         <ul class="submenu">
           <li>Unified Naming Convention</li>
           <li>Version Control</li>
         </ul>
       </div>
    </li>

После этого приложение должно быть в состоянии определить, в каком элементе подменю произошло событие touchend / mouseup. Я привязываю событие touchstart к пункту меню, жду 500 мс, а затем сообщаю, что подменю должно отображаться. Когда пользователь отпускает палец, должно сработать событие touchchend, закрывающее подменю. Если пользователь перестал касаться элемента подменю, это должно быть обнаружено. В настоящее время определение того, для какого элемента подменю произошло событие мыши, работает в Safari на рабочем столе:

$('ul.submenu li').live('mouseup', function(e){
   console.log($(e.currentTarget)); //works on the desktop
});

но если я сделаю то же самое, используя обработчик touchchend, он не будет работать на ipad:

$('ul.submenu li').live('touchend', function(e){
   console.log($(e.currentTarget)); //never fires
});

если я ищу каждое событие touchchend, я могу получить ссылку на родительский элемент подменю, когда заканчиваю касание элемента подменю:

$(document.body).bind('touchend', function(e) {
    console.log($(e.target).html()); //logs ASSET MANAGEMENT
 });

но нет ссылки на пункт подменю.

Кто-нибудь знает, почему событие touchend не запускается в элементах подменю?

Спасибо


ios javascript webkit touch-event
person Craig    schedule 07.10.2011    source источник

Ответы (4)


arrow_upward
18
arrow_downward

touchend не срабатывает, потому что touchcancel сработал раньше. Если вы хотите полностью обработать сенсорные события, вам нужно позвонить

e.preventDefault()

в обратном вызове события «touchmove», в противном случае, когда происходит событие touchmove, если браузер решает, что это событие прокрутки, он запускает touchcancel и никогда не запускает touchend.

person Stefan    schedule 11.06.2012

arrow_upward
4
arrow_downward

Может, уже поздно отвечать. Это событие никогда не сработает, потому что события касания запускаются в том самом элементе, на котором произошел touchstart. Итак, чтобы делать то, что вы хотите, одним из решений является использование метода document.elementFromPoint, которому вы отправляете соответствующие координаты x и y.

person user1368691    schedule 01.05.2012

arrow_upward
0
arrow_downward

Если вам не нужно использовать данные мультитач, вы можете продолжать использовать mouseup на ipad.

дополнительное чтение: http://developer.apple.com/library/IOS/#documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html.

person roee    schedule 12.10.2011
comment
Спасибо roee за ответ, к сожалению, событие mousedown не срабатывает сразу при касании экрана. Он срабатывает только после того, как ваш палец покидает экран вместе с событием mouseup. quirksmode.org/blog/archives/2008/08/iphone_events.html < / а> - person Craig; 18.10.2011

arrow_upward
0
arrow_downward

Для вашего события touchmove;

Если вы не хотите ничего делать при touchmove:

return false;

Если вы хотите предотвратить поведение по умолчанию, но выполнить некоторый код при touchmove:

e.preventDefault();

Эта проблема более выражена на iPad.

person Aman Kejriwal    schedule 06.08.2020