Проверяем bezumkin.ru на мобильных устройствах

Вчера с удивлением обнаружил, что скрипты Tickets не работают на мобильных устройствах Apple. Проблема обнаружилась на iPad, а потом подтвердилась и на iPhone.

Не работают независимо от браузера, что в Chrome, что в Safari нажатия на ссылки "ответить" и "изменить" просто игнорируются. А вот на Android проблем нет, всё работает как положено. Стало быть, дело в iOS.

Еще интересный момент - кнопки нажимаются нормально, проблема только у ссылок.

В итоге разгадка оказалось простой - think different. На устройствах Apple нажатия на ссылочки для javascript рассматриваются не как click, а как touch. И если задержать палец в Safari на такой ссылке, и нажать "открыть" - то она срабатывает.

Стало быть, нужно пройти по всем формам, и везде, где у ссылки есть onclick="" и добавить еще ontouchstart="":

<a href="#reply" ontouchstart="return Tickets.forms.reply([[+id]]);" onclick="return Tickets.forms.reply([[+id]]);">
    <i class="icon-pencil"></i>ответить
</a>

return нужен, чтобы не было перехода по ссылке.

Возможно, дело действительно в размере ссылки, или её внешнем виде? Не знаю, но после развешивания дополнительного события всё заработало. А вот, например, на http://habrahabr.ru точно так же нельзя ответить на комментарий с iPad.

Вот и всё, теперь комментарии у меня на сайте работают в iOS - прошу побродить по сайту и проверить. Может еще что найдём?

P.S. Еще погуглил, и нашел такое объяснение:

Do you have mobile specific meta tags at the top?(viewport/content width) I believe as of a recent iOS update (iOS 6.something), if the page has mobile meta tags, it will not recognise click events. You may want to do as TheDoc recommended and look in to touch events.

То есть, виноваты мета-теги в заголовке моих страниц, которые говорят, что сайт готов работать с мобильными устройствами. Я их добавлял для нормального отображения на телефонах, и не думал, что аукнется на планшетах.

В любом случае, сейчас работает везде.