2014-06-06 3 views
3

Это динамическое приложение JavaScript, над которым я работаю. У меня есть много элементов привязки <a>, которые имеют класс. Когда этот класс нажат, что-то должно произойти. Это отлично работает в Firefox, Chrome, IE, но в некоторых случаях событие click не запускается на мобильных Safari (iPad и iPhone).Mobile Safari иногда не вызывает событие click

Эти элементы имеют точно такой же CSS, что и их положение, которое отличается (они находятся в разных контейнерах).

Я пробовал различные решения, которые я нашел здесь, но не повезло. Например:

  • заходящего курсор на указатель
  • код in this answer

Есть ли у вас какие-либо другие идеи, которые могли бы помочь мне найти решение этой проблемы? Почему событие click вызывает только в некоторых случаях?

Спасибо!

+0

У вас должен быть атрибут href для обеспечения правильной работы якоря. Используйте .preventDefault() в js, чтобы противостоять его поведению. – Kyle

+0

Спасибо Кайл. Добавлено hrefs, но не повезло. Другие элементы, которые работают, также не имели hrefs. Как именно я должен использовать .preventDefault()? – watt

+0

Приложение использует jQuery, поэтому в его функции щелчка есть .preventDefault(). – watt

ответ

3

Вы пробовали это? Это происходит потому, что ИОС иногда не не срабатывает событие щелчка, распознает только сенсорное событие

$(document).on('touchstart click', [Selector], [ Event ] 
+1

Спасибо. Кажется, что добавление работы touchstart работает.Однако это может быть не лучшее решение, поскольку действие запускается, даже если пользователь просто пытается прокручивать и начинает пальцем по этой ссылке. Есть ли лучший способ, чем использовать «touchstart»? – watt

0

Дополнительное событие для мобильных устройств. Попробуйте добавить «вкладку», а не только щелкнуть. Вы можете их комбинировать:

$(document).on('click tap', [selector], [handler]) 
+0

Спасибо, я думаю, вы имели в виду 'tap'. Я пробовал большинство событий без каких-либо результатов. – watt

+0

глупый я, да, я имел в виду кран. – xanobius

+0

Возможно, это поможет опубликовать structur, так что вы можете увидеть DOM. Может быть, событие ist захвачено в другом месте и не пузырится через – xanobius

4

события нажмите полученное из крана на прошивке будет пузырь, как и ожидался при определенных условиях просто - один из которых вы упомянули, стиль курсора. Вот еще:

Целевой элемент, или любой из его предков вплоть до, но не включая в <body>, имеет явный обработчик события установлен для любого из мыши событий. Этот обработчик событий может быть пустой функцией.

http://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html

Это гораздо лучше исправить вектор, и может быть сделано без проверки браузера. Вы должны добавить дополнительный DIV из-за «не включая <body>» часть:

<body> 
    <div onclick="void(0);"> 
    <!-- ... all your normal body content ... --> 
    </div> 
</body> 

Теперь каждый щелчок событие, происходящее внутри этот DIV будет пузыриться, как ожидаются, в прошивке (то есть вы можете поймать их с $(document).on('click', '.class', etc...)).

+0

Это должен быть принятый ответ. – jeffdill2

Смежные вопросы