JQuery не работает с ipad

У нас есть веб-приложение, которое использует JQuery blockUI, чтобы открыть всплывающее окно и сделать некоторые действия. Все это отлично работает на Safari, а проблема IE 8. - с Ipad. ни одно из действий во всплывающем окне не отвечает. он просто остается на этой странице. даже если близко не работает. нам нужно добавить что-нибудь еще? вот код, который открывает страницу и нажмите событие для закрытия.

<script>
$(document).ready(function() {
  $.ajaxSetup( {
           cache:false
   });

        $("#sendInviteDiv").load("invite.htm?action=view&pid="+pid);
            $.blockUI({ message: $('#sendInviteDiv'),
                centerY: 0,
                    css: {
                top:  ($(window).height() - 550) /2 + 'px',
                        left: ($(window).width() - 870) /2 + 'px',
                        width: '870px'
                }
            });
            //var ua = navigator.userAgent;
            //var event = (ua.match(/iPad/i)) ? "touchstart" : "click";
            //alert(ua);

            $('#closeInvite').click($.unblockUI);

    $('#inviteBtn').click(function() {
//script to load 
       //setPositionDetails('${formName}','inviteBtn');

       });
}


});


</script>

оценить указатели.

javascript включен, а всплывающие окна разрешены в настройках Ipad Safari.

ОТВЕТЫ

Ответ 1

Я обычно использую

.bind("click touchstart", function(){

});

вместо:

.click(function(){

});

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

Ответ 2

Я знаю, что это было задано давно, но я нашел ответ, ища этот точный вопрос.

Существует два решения.

Вы можете установить пустой атрибут onlick в элементе html:

<div class="clickElement" onclick=""></div>

Или вы можете добавить его в css, установив курсор указателя:

.clickElement { cursor:pointer }

Проблема в том, что на ipad первый щелчок на неядерном элементе регистрируется как зависание. На самом деле это не ошибка, потому что это помогает с сайтами, которые имеют меню hover, которые не были оптимизированы для планшетов/мобильных устройств. Установка курсора или добавление пустого атрибута onclick сообщает браузеру, что этот элемент действительно является областью, доступной для кликов.

(через http://www.mitch-solutions.com/blog/17-ipad-jquery-live-click-events-not-working)

Ответ 3

ОБНОВЛЕНИЕ: я переключил .bind на .on потому что теперь это предпочтительный способ, говорит jQuery.

Начиная с jQuery 1.7, метод .on() является предпочтительным методом для прикрепления обработчиков событий к документу. jquery.com

ПРИМЕР:

$('.button').on("click touchstart", function() {

});

Ниже приведена окончательная версия события click и touchstart поскольку оно по-прежнему срабатывает даже с новыми объектами DOM, которые добавляются после загрузки DOM. Включение этого окончательного решения события щелчка для любого сценария.

$(document).on("click touchstart", ".button", function () {

});

Ответ 4

Используйте вместо этого функцию bind. Сделайте его более дружелюбным.

Пример:

var clickHandler = "click";

if('ontouchstart' in document.documentElement){
    clickHandler = "touchstart";
}

$(".button").bind(clickHandler,function(){
    alert('Visible on touch and non-touch enabled devices');
});

Ответ 5

Благодаря предыдущим комментариям я обнаружил, что для меня все работало:

Либо добавление заглушки onclick к элементу

onclick="void(0);"

или пользовательский стиль указателя курсора

style="cursor:pointer;"

или как в моем существующем коде, мне нужен код jquery tap

$(document).on('click tap','.ciAddLike',function(event)
{
    alert('like added!'); // stopped working in ios safari until tap added
});

Я добавляю перекрестную ссылку обратно в Apple Docs для тех, кто интересуется. См. Apple Docs: внесение событий в число кликов

(Я точно не знаю, когда мое гибридное приложение перестало обрабатывать клики, но, похоже, я помню, что они работали с iOS 7 и более ранними версиями.)

Ответ 6

на самом деле, это оказалось пару изменений javascript в коде. вызов метода javascript с; в конце. размещение тегов script в теле вместо головы. и интересно даже изменить отображаемый текст (пожалуйста, "click") на то, что не является событием. поэтому Пожалуйста, оцените и т.д.

отключил отладчик на сафари, он не давал много информации или даже ошибок в разы.

Ответ 7

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

var handleClick= 'ontouchstart' in document.documentElement ? 'touchstart': 'click';
$(document).on(handleClick,'.button',function(){
alert('Click is now working with touch and click both');
});

Ответ 8

У нас есть аналогичная проблема: событие click на кнопке не работает, если пользователь не прокрутил страницу. Ошибка появляется только на iOS.

Мы решили это, немного прокрутив страницу:

$('#modal-window').animate({scrollTop:$("#next-page-button-anchor").offset().top}, 500);

(Это не отвечает на конечную причину. Возможно, какая-то ошибка в Safari mobile?)

Ответ 9

У меня был промежуток, который создавал бы всплывающее окно. Если бы я использовал "click touchstart", это вызовет части всплывающего окна во время касания. Я исправил это, сделав span "click touchhend".

Ответ 10

Я обнаружил, что когда я сделал привязку более конкретной, она начала работать на iOS. Я имел:

$(document).on('click tap', 'span.clickable', function(e){ ... });

Когда я изменил это на:

$("div.content").on('click tap', 'span.clickable', function(e){ ... });

iOS начала отвечать.

Ответ 11

Ни одно из утвержденных решений не сработало для меня. Вот что в итоге сработало:

Я переместил код, который был в $(document).ready out, если он не требовался в готовом документе. Если необходимо иметь его в готовом документе, тогда вы перемещаете этот критический код в jQuery(window).load().