Вопрос по ios, jquery – Как заставить мою функцию «щелкнуть» на iOS

16

У меня есть набор Div, которые действуют как кнопки. Эти кнопки имеют простую функцию jquery click (), которая работает во всех браузерах, кроме iOS.

Например:

<div class="button">click me</div>

а также

$('.button').click(function(){

   alert('hi');

});

Я не уверен, почему это не работает на iOS - очевидно, что здесь нет «нажатия». в iOS

К сожалению, у меня нет устройства iphone, чтобы проверить это самостоятельно, но я получаю много жалоб от своих клиентов, которые хотят щелкнуть по кнопкам, и ничего не происходит.

Что является ключом к тому, чтобы заставить это работать?

Слишком много недостающих деталей в вашем вопросе. Если вы используете Mac, запустите эмулятор iOS с Safari в режиме разработчика. Кстати, когда вы привязываете обработчик кликов к .button? Это происходит после$.ready уволен? Lior Cohen
click отлично работает в iOS, ваша проблема в другом месте. И nnnnnn правильно, вы также должны изучить использование<button>. mu is too short
Прошу прощения, ребята, я упростил свой код, когда на самом деле эти функции щелчка загружаются в режиме реального времени («функция щелчка») - это что-нибудь изменит? willdanceforfun
Я создалfiddle и он отлично работает в сафари на iphone4 mprabhat
Я не знаю о iOs, но ваш код не будет работать для пользователей браузеров настольных компьютеров, даже если эти пользователи используют клавиатуру, но не указательное устройство (то есть, нет мыши) - что некоторые пользователи делают по своему выбору, а другие пользователи делают это должным образом. до некоторой физической инвалидности. Вы должны использовать<a> элементы (вы все еще можете оформить их так, как вы хотите). И если у вас есть платящие клиенты, которые ожидают совместимость с iPhone, вам нужно приобрести себе iPhone для тестирования - вы можете списать его на расходы ... nnnnnn

Ваш Ответ

5   ответов
2

Ответ Марека, который адаптирует событие к устройству для запуска функции, вот код, который вынуждает запускать щелчок на устройствах iOS, где сначала происходит событие touchstart:

var UA = navigator.userAgent,
iOS = !!(UA.match(/iPad|iPhone/i));

if (iOS) {
   $(document).on('touchstart', function (e) {
       e.target.click();
   });
}
35

Нажмите & quot ;: означает, что на одном и том же элементе происходят события mousedown и mouseup ИЛИ элемент активируется с клавиатуры.

отJquery Bug, есть работа вокруг, просто добавь"cursor: pointer" элементу CSS, и событие click будет работать как положено. и вы даже можете увидеть этоJquery нажмите на Ios за помощью

Удивительно, но это сработало! willdanceforfun
Что ж, у Android нет проблем, используя свою инициативу и заставляя & quot; щелкнуть & quot; рассматривается как прикосновение. iOS - это новый IE
Да, только что имел дело с flexbox на Safari, кошмар.
5

Я попытался использовать «курсор: указатель», onclick = & quot; и даже преобразовать элемент в тег привязки.

То, что я сделал, чтобы это работало, - это связал событие touchstart с событием click. Чтобы это работало на всех платформах, мне нужно было поднять такой уродливый пользовательский интерфейс:

var ua = navigator.userAgent,
event = (ua.match(/iPad/i) || ua.match(/iPhone/)) ? "touchstart" : "click";

jQuery("body").on(event, '.clickable_element', function(e) {
    // do something here
});
Это помогло мне, спасибо!
Полностью работает для меня! Переписал безjQuery("body")хотя и использовал немного менее запутанное имя переменной вместо «события», но я думаю, что последнее было только для пояснения.
2

Ответ Марека это мое мнение (оно немного очищено):

var ua = navigator.userAgent, 
pickclick = (ua.match(/iPad/i) || ua.match(/iPhone/)) ? "touchstart" : "click";

$('.clickable_element').on(pickclick, function(e) {
     // do something here
});

Впереди у промышленности еще много работы, когда дело доходит до стандартов & # x2026;

EDIT:

Не работает на телефонах Android. Взял более жесткий подход:

if (document.documentElement.clientWidth > 1025) { pickclick = 'click' }
if (document.documentElement.clientWidth < 1025) { pickclick = 'touchstart' }

$('.clickable_element').on(pickclick, function(e) {
     // do something here
});
0

$('button').bind( "touchstart", function(){
    alert('hi');
});

Другое решение состоит в том, чтобы установить курсор элемента на указатель, и он будет работать с событием jQuery live и click. Установите это в CSS.

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

Похожие вопросы