работает ли mousedown/mouseup в jquery для ipad?

Я использую текущий код:

$('body').mousedown(function() {
        $('div#extras').fadeTo('fast', 1);
});

$('body').mouseup(function() {
        $('div#extras').delay(2000).fadeTo(1500, 0);
});

Это отлично работает в сафари, но когда я загружаю его и проверяю на iPad, он не работает?


ipad jquery onmousedown
person Annie    schedule 21.07.2010    source источник

Ответы (4)


arrow_upward
86
arrow_downward

Нашел как это сделать для айпада для интересующихся:

Вместо кода, который я использовал в своем вопросе, вы должны использовать:

$('body').bind( "touchstart", function(e){
        $('div#extras').fadeTo('fast', 1);
});

&

$('body').bind( "touchend", function(e){
        $('div#extras').delay(2000).fadeTo(1500, 0);
});
person Annie    schedule 21.07.2010
comment
$('body').on( mousedown touchstart, function(e){ // это будет работать одновременно на настольных и мобильных устройствах }) - person Denis; 17.05.2013
comment
Просто хочу добавить, не забудьте использовать e.preventDefault() в случае наложения/всплывающего окна модели. - person Arshad; 13.12.2016

arrow_upward
8
arrow_downward

Не совсем.

Документы Apple

Цитировать:

Кликабельный элемент — это ссылка, элемент формы, область карты изображения или любой другой элемент с обработчиками mousemove, mousedown, mouseup или onclick. Прокручиваемый элемент — это любой элемент с соответствующим стилем переполнения, текстовыми областями и прокручиваемыми элементами iframe. Из-за этих различий вам может потребоваться изменить некоторые элементы на интерактивные, как описано в разделе «Делаем элементы кликабельными", чтобы получить желаемое поведение в ОС iPhone.

(выделено мной)

person scunliffe    schedule 21.07.2010
comment
Хм, я не уверен в этом, но у меня он отлично работает на iPad. :) - person Annie; 22.07.2010

arrow_upward
6
arrow_downward

На самом деле не отвечая на ваш вопрос, но может быть удобно для людей, которые пришли сюда, чтобы найти «jQuery mousedown/mouseup на ipad».

Я всегда использую этот маленький трюк:

$(element).hover(function() {
   // Do something
});

Это срабатывает при касании при использовании iPad и изменяет действие при нажатии за пределами элемента, поскольку это событие наведения. Так, например:

// Assuming the element has 'opacity: 0' in CSS

$(element).hover(function() {
   $(this).animate({'opacity': 1}, 200);
});

Создает эффект затухания «при щелчке» и эффект затухания «при наведении мыши».

person Jeffrey Roosendaal    schedule 05.11.2014

arrow_upward
5
arrow_downward

Старый пост, но есть универсальное решение:

$('body').on('mousedown touchstart',function(e){
    $('div#extras').fadeTo('fast', 1);
});
$('body').on('mouseup touchend',function(e){
    $('div#extras').delay(2000).fadeTo(1500, 0);
});

Вы заметите, что я использую mousedown с touchstart и mouseup с touchend. Это покрытие мобильного и настольного использования.

person Ivijan Stefan Stipić    schedule 02.04.2018