Как сделать div на iOS-устройствах кликабельным?

Столкнулся с какой-то аномалией. Всем известно, что у iOS свои приколы с обработкой клика на мобильной платформе, но тут просто что-то невероятное. Я написал несложное приложение и просто не понимаю почему не срабатывают клики на div элементах разметки. Я попробовал: - задать cursor: pointer (как в теге style, так и в самом div'е)

<style>
    .poi {
      cursor: pointer;
      transition: transform 0.1s ease;
      transform: scale(1);
      user-select: none;
    }
</style>

- задать tabIndex="1"

<input type="text" tabindex="1" class="name" placeholder="Имя (Опционально)">

- задать onClick="" (пробовал и писать внутри параметра атрибута название соответствующей функции - не помогло)

<div tabindex="4" class="load poi" style="cursor: pointer;" onClick=""><span>Загрузить</span></div>

- использовать touchend вместо click или mouseup

const event = navigator.userAgent.match(/iPhone|iPad|iPod/i)? "touchend" : "click";
calculateButton.addEventListener(event, () => {
    calculate();
});

Большинство решений было найдено здесь, но ничего из этого ни в отдельности ни в совокупности не помогло. Проверка проводилась на iPhone XR iOS 13.4.1. Весь код можно найти здесь, а посмотреть здесь. Заранее благодарю!


Ответы (1 шт):

Автор решения: Vadizar

Попробуйте также завязаться на touchstart:

 document.addEventListener('touchstart', calculate);

У меня такое решение сработало.

→ Ссылка