Обнаружение двойного нажатия на экран ipad или iphone с помощью javascript

Я хотел бы определить, имеет ли пользователь двойное нажатие на ipad или iphone.

Существует ли javascript-событие, которое обеспечило бы эту функциональность?

Ответ 1

Вы можете использовать мобильную библиотеку jQuery для создания своего приложения: http://jquerymobile.com/; у него много встроенных сенсорных событий. Также вы можете попробовать jQuery touch library: http://jqtouch.com/

Ответ 2

Это можно использовать для двойного нажатия или двойного щелчка. В чистом javascript:

var mylatesttap;
function doubletap() {

   var now = new Date().getTime();
   var timesince = now - mylatesttap;
   if((timesince < 600) && (timesince > 0)){

    // double tap   

   }else{
            // too much time to be a doubletap
         }

   mylatesttap = new Date().getTime();

}

Ответ 3

Одна из основных идей - сделать это следующим образом:

Чтобы создать событие двойного щелчка (или двойного щелчка), вам нужно создать код в событии onClick.
Причина, по которой вы, скорее всего, хотите дважды нажать/клик, потому что у вас уже есть что-то, связанное с событием onClick, и вам нужен другой жест одного и того же элемента.
Это означает, что ваше событие onClick должно запускать событие onClick только после подтверждения setTimeout().
Таким образом, базовый код запускает функцию, прикрепленную к событию onClick, используя команду setTimeout(). Первый щелчок говорит "Запустить таймер + запустить функцию с помощью setTimeout() после того, как скажем... 500 миллисекунд. Во второй раз, когда вы нажали, вы проверили бы, будет ли второй клик находиться внутри определенного временного интервала, чтобы считать двойным нажатием Так что если время окончания меньше 500 миллисекунд, вы отмените setTimeout() с помощью clearTimeout(), а затем запустите совершенно другую функцию (функцию, которую вы хотите запустить для двойной вкладки/клика)
Остановка действия по умолчанию? - Возможно, что-то вроде stopPropagation() или cancelBubble() сделало бы трюк. Честно говоря, я не знаю, но где я начну исследовать.

Ответ 4

Обнаружение двойного нажатия

попробуйте следующий фрагмент на сенсорном устройстве

event.preventDefault() отключит двойное нажатие на div#double-tap

document.getElementById("double-tap").addEventListener("touchstart", tapHandler);

var tapedTwice = false;

function tapHandler(event) {
    if(!tapedTwice) {
        tapedTwice = true;
        setTimeout( function() { tapedTwice = false; }, 300 );
        return false;
    }
    event.preventDefault();
    //action on double tap goes below
    alert('You tapped me Twice !!!');
 }

div#double-tap {
  height: 50px;
  width: 200px;
  border: 1px solid black;
  background-color: lightblue;
  line-height: 50px;
  text-align: center;
  margin: 50px auto;  
}

<div id="double-tap">Double Tap Me !!!</div>

Ответ 5

Я создал этот код в JavaScript и, похоже, работает хорошо. (Я тестировал его на своем iPad 2.) Это в основном код для сказанного выше.

var clickTimer = null;

function touchStart() {
    if (clickTimer == null) {
        clickTimer = setTimeout(function () {
            clickTimer = null;
            alert("single");

        }, 500)
    } else {
        clearTimeout(clickTimer);
        clickTimer = null;
        alert("double");

    }
}

Ответ 6

Я нашел это решение на Stackoverflow где-то, но забыл, что такое сообщение. Он работает для двойного щелчка в браузере и дважды нажимает на iPhone.

Я использую 'touchend click' для обнаружения двойного щелчка на обозревателе и iPhone. Чтобы реализовать только на iPhone, удалите клик.

var timeout;
var lastTap = 0;

$('element').on('touchend click',function(e){
    var currentTime = new Date().getTime();
    var tapLength = currentTime - lastTap;        

    e.preventDefault();
    clearTimeout(timeout);

    if(tapLength < 500 && tapLength > 0){

        //Double Tap/Click

    }else{

        //Single Tap/Click

        timeout = setTimeout(function(){
            //Single Tap/Click code here

            clearTimeout(timeout); 
        }, 500);
    }
    lastTap = currentTime;
});

Ответ 7

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

Однако, если вы отмените поведение по умолчанию, вы можете получить двойную запись самостоятельно. Вот пример плагина, который делает это для you-- плагина jQuery doubletap.

Ответ 8

на основе последних документов jquery, реализация двойного нажатия

https://gist.github.com/attenzione/7098476

Ответ 9

technoweenie jquery.doubletap делает и эта ссылка: наконец-то запущены мобильные события jQuery похоже, способен решить задачу...

Ответ 10

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

Ответ 11

Может быть поздно (на самом деле, черт возьми, поздно), но чистое и простое решение JS для тех, кто скрывается в будущем:

var tapped="";
function dbtapper(elem=false,arg1, arg2, arg3, timer=1400){
    if(tapped==""){
        //Here is single tap

        tapped = setTimeout(function(){tapclean()}, timer)
        lastclick = elem;
        //variable lastclick is to prevent double clicking from happen
        //when clicking different object with double-click listener.

    } else if(lastclick==elem){
        //Here is double tap, if you want more (triple&beyond),
        //add doubletap/tripletap checker variable into tapclean().
        //and set it to true here!, example included.
        //you could also add more setTimeout to var-tapped so user will
        //have more time to do triple&up taps.

        tapclean();
        //doubletapped=true;
        mypersonalfunc(arg1, arg2, arg3);
    } else {
        tapped = setTimeout(function(){tapclean()}, timer);
        lastclick = elem;
}
}
function tapclean(){
    clearTimeout(tapped);
    tapped="";
    //doubletapper=false;
}

С этим вы можете легко сделать одно нажатие, двойное, тройное, четвертое,... до бесконечности и далее!
Примечание: чтобы использовать проверку элементов, вызовите такую функцию:
dbtapper(YOURELEMENT), ie: <span onclick="dbtapper(this)">Click Me</span>

Это не обязательно, но вы можете использовать его без штрафа (dbtapper()), но если вам нужно передать аргумент в функцию, убедитесь, что вы вводите false для первого аргумента, если вы не указываете его на элемент.

Without element pointer: dbtapper(false,yourarguments)
With element pointer: dbtapper(document.getElement*******,yourarguments)
Alternatively, you can use an unique elem arg for each element:
                    dbtapper('omega',yourarg) or dbtapper(69,yourarg)
Though this is not recommended if you have a huge amount of double tapping elements.