Обработчик кликов jQuery не вызывается на iPad - PullRequest
Новая
       0

Обработчик кликов jQuery не вызывается на iPad

7 голосов
/ 19 октября 2011

У меня есть проект, использующий jQuery и много динамически генерируемого контента. В верхнем левом элементе есть обработчик click - «инициативный» показатель - он отлично работает в настольном Safari, но совсем не вызывается в Mobile Safari; серый оверлей никогда не появляется и никаких действий не предпринимается. Это та же история с обработчиком щелчков в области «Точки попадания» (172 справа) и статусом («Добавить эффект состояния» внизу; подтвердите; он отображается поверх портрета): все работают на настольном компьютере, но не на мобильном Safari. 1002 *

Я сократил код до следующего: 

<html>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
    <script>
      $(function() {
        $('#dynamic').click(function() {alert("works")});
        $('#dynamic-with-onclick').click(function() {alert("works")});
        $('#dynamic-with-dynamic-onclick').click(function() {alert("works")}).attr('onclick', '');
      })
    </script>
  </head>
  <body>
    <ul>
      <li id='static' onclick='alert("works")'>If there's an onclick it's called</li>
      <li id='dynamic'>And if there's no onclick the iPad won't see other click events</li>
      <li id='dynamic-with-onclick' onclick=''>But if there is one all events are called</li>
      <li id='dynamic-with-dynamic-onclick'>And if we add one everything works</li>
    </ul>
  </body>
</html>

Обновление

Сейчас это выглядит намного проще, чем когда я первоначально задавал этот вопрос 10 месяцев назад; при использовании современного Mobile Safari все обработчики кликов будут регистрироваться как обычно. Так что иди и просто используйте $(...).click(function() {})!

Ответы [ 2 ]

8 голосов
/ 08 ноября 2011

Мы могли бы сделать хакерскую вещь и просто добавить onclick ко всему, что мы хотим кликабельно. Но "правильный" способ сделать это , кажется, использует событие, соответствующее iPad: 

var hitEvent = 'ontouchstart' in document.documentElement
  ? 'touchstart'
  : 'click';
$('#dynamic').bind(hitEvent, function() {alert("works")});
$('#dynamic-with-onclick').bind(hitEvent, function() {alert("works")});
$('#dynamic-with-dynamic-onclick').bind(hitEvent, function() {alert("works")}).attr('onclick', '');

Еще один способ сделать это - привязать к нескольким событиям и быть довольным тем, кого вызовут.

В настоящее время я использую первое решение; Я мог бы попробовать другой, так как я думаю, что он чище.

4 голосов
/ 21 марта 2013

Сейчас уже поздно отвечать, но для тех, кто ищет решение, вот ответ:

В iPad происходит другое поведение для события щелчка не привязанных элементов.Он распознает их первое событие нажатия как hover.

Решение, которое я нашел для этого, состоит в том, чтобы

либо добавить атрибут onclick = "" к этому элементу, либо

Свойство «курсор: указатель» css.

Любое из этих решений сообщит iPad, что этот элемент является интерактивной областью.

(через http://swsharinginfo.blogspot.in/2013/03/solution-for-click-event-issue-on-ipad.html)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...