Mobile Safari Event Issue

Я разработал веб-сайт с меню, которое изначально невидимо. Когда пользователь нажимает на кнопку, меню становится видимым. Есть два способа для пользователя, чтобы скрыть ныне видимое меню:Mobile Safari Event Issue

Нажмите кнопку, вызвавшую меню, чтобы стать видимым
Нажмите в любом месте на веб-странице, которая не является меню

Способ, которым я закодировал второй вариант, - связать событие onclick с окном и сравнить его, когда пользователь нажал на позицию меню, чтобы определить, должно ли это меню скрываться. Это отлично работает в Firefox и Safari, но это не работает в Mobile Safari.

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

Возможно ли присвоить события окну в Mobile Safari?

источник

2010-07-13 mouth

Вы можете просто добавить onclick="void(0);" в некоторый <div>, который охватывает всю страницу так, чтобы независимо от того, вы всегда щелкаете по элементу с событием onclick. Однако это не отличное решение.

Я бы предпочел, чтобы событие onclick не было привязано к окну. Почему бы вам не создать контейнер <div>, на котором есть это событие. Затем обработайте его так же, как вы сейчас.

источник

2010-07-16 06:25:41 epadilla

У меня возникла такая же проблема. Вот что сработало для меня. (Примечание: Я работаю в контексте Modernizr и JQuery)

Во-первых, я добавить пользовательский Modernizr класс, используя Modernizr's addTest Plugin API для проверки прошивкой, который добавит класс appleios или no-appleios соответственно.

Потому что в моих исследованиях body, похоже, запускает события в своей собственной повестке дня, я делаю небольшую предосторожность, обертывая все содержимое документа элементом в контексте iOS. Затем я добавляю обработчик события к этому элементу.

$(".appleios body").wrapInner('<div id="appleios-helper" />'); 
$("#appleios-helper").bind("mouseup", function(){return;});

Что было предложено ранее в этой теме используется void(0). Я сделал несколько быстрых тестов и обнаружил, что void(0), поскольку событие просто не вызывало прикосновений к телу, которое должно быть распознано. Когда я включил свою собственную «пустую» функцию в виде function(){return;}, все стало работать.

Все это зависит от того, что в Mobile Safari не запущено никаких событий, если только элемент явно не активировал события (Safari Web Content Guide.) Вставив это пустое событие на обертку, все будет пузыриться до тела.

Если вы делаете смирительную JavaScript ни с одной из этих библиотек, тот же эффект может быть достигнут в HTML разметке

<html> 
... 
<body> 
<div id="appleios-helper" onmouseup="function(){return;}"> 
... 
</div> 
</body> 
</html>

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

источник

2011-02-14 20:08:32 danott

Просто добавив фиктивный OnClick обработчик к телу HTML работает для меня:

<body onclick="void(0)">

Обратите внимание, что я использую обычные обработчики событий в реальном времени, как показано ниже:

function liveHandler(event) { 
    var target = event.target; ...} 

window.addEventListener(evtype, liveHandler, true); 
// evtype such as 'mousedown' or 'click' 
// we use the capturing mode here (third parameter true)

источник

2011-05-08 22:59:37

Это старый вопрос, но сегодня я боролся с тем же.

Я обнаружил, что с использованием touchstart мероприятие работает.

Я решил так:

var isTouchDevice = 'ontouchstart' in document.documentElement; 
if (isTouchDevice) { 
    // Do touch related stuff 
    $(document).on('touchstart', function (event) { 
    // Do stuff 
    }); 
} else { 
    // Do non-touch related stuff 
    $(document).on('click', function() { 
    // Do stuff 
    }); 
}

источник

2013-12-03 11:22:13

Вы также можете:

$('body').css('cursor', 'pointer');

Понятия не имею, что эти "инженеры" в компании Apple делают. ЛОЛ.

У этого есть проблемы. Вы не захотите делать это на каждом сенсорном устройстве. Только сенсорные устройства, которые также не имеют указательного устройства (например, ноутбуки с сенсорными экранами).

Источник: http://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html

Вывод статьи таков:

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

источник

2014-11-11 23:02:38 Stoutie

Mobile Safari Event Issue

ответ

Смежные вопросы