Подтвердить что ты не робот

Phonegap 2.4.0 с Android 4.2 - странное поведение двойного клика

Я использую phonegap 2.4.0 для создания приложения для Android и iOS.

Теперь я узнал, что событие onclick в ссылках запускается дважды в Android-приложении с помощью Android 4.2.2 на устройстве Nexus 4, как двойной щелчок (althoug я использовал его только один раз!).

<a href="#" onclick="$(this).append('test'); return false;" style="some styles...">some text</a>

Используемые библиотеки:

  • jquery 1.9.1
  • jquery mobile 1.3.0 (rc)
  • jquery ui 1.10.0
  • jquery touch punch 0.2.2
  • phonegap 2.4.0

После того, как я нажал (или нажал) ссылку на моем Nexus 4 (Android 4.2.2), строка "test" добавляется дважды в приложение.

Это НЕ происходит, когда я тестирую его как мобильное веб-приложение прямо в браузере Android.

Он также работает на моем Samsung S3 (Android 4.1.2) внутри приложения. На iPhone тоже нет проблем.

Кто-нибудь еще признал это странное поведение? (и, возможно, смог его исправить?;-))

4b9b3361

Ответ 1

Использование временного решения из scirra.com

last_click_time = new Date().getTime();
document.addEventListener('click', function (e) {
    click_time = e['timeStamp'];
    if (click_time && (click_time - last_click_time) < 1000) {
        e.stopImmediatePropagation();
        e.preventDefault();
        return false;
    }
    last_click_time = click_time;
}, true);

Ответ 2

Я очень хорошо справился с подобной ситуацией с решением Soulwax, однако я не хотел препятствовать быстрым щелчкам пользователя, отслеживая временные интервалы. Вместо этого я просто отслеживаю тип события в объекте данных ссылки и, если он пытается обработать щелчок сразу после сенсорного экрана, я игнорирую этот вызов.

$('.link').on('touchstart click', function(e){
  e.preventDefault();

  //Prevent against handling a click immediately after touchstart.
  if(e.type == "click" && $(this).data("lastTouch") == "touchstart"){
    e.stopImmediatePropagation();
    return false;
  }
  $(this).data("lastTouch", e.type);

  $('.nav-bar').toggleClass('active');
});

Ответ 3

Я думаю, что причиной этих двойных/нескольких кликов являются неисправности аппаратных ускорений, я испытываю одновременные клики + распространение, распространение легко предотвратить, однако, поскольку третий аргумент addEventListener не соблюдается в моем случае, я могу " t предотвратить двойной щелчок даже с ранее ответившим кодом, вот что я в конечном итоге использовал

function cw(event) // click wall
{ try {
    click_time_cw = (new Date()).getTime();
    if (click_time_cw && (click_time_cw - last_click_time_cw) < 350) {
        event.stopImmediatePropagation();
        event.preventDefault();
        add_log('prevented misclick [CW] '+(click_time_cw - last_click_time_cw));
        return true;
    }
    last_click_time_cw = click_time_cw;
    event.stopImmediatePropagation();
    event.stopPropagation();
    return false;
} catch(e){ add_alert(e,"stpr"); } }

вам также нужно инициализировать last_click_time_cw = (новая дата()). getTime() где-то

это пример onclick:

<button class="btn" onclick="if(cw(event)) return true; onclick_logic()">something</button>

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

Ответ 4

Мое исправление было немного другим. Я использовал touchend вместо click прослушиватель событий, потому что click не запускается каждый раз, когда это необходимо. Скажем, вы нажмете кнопку, прослушиватель событий щелчка будет запущен, но если вы снова нажмете эту кнопку, это не так.

Это происходит с любым типом элемента DOM. Моя среда:

  • jQuery 1.9.1;
  • jQM 1.3.2;
  • Phonegap 3.5.0-0.21.14.

Вот мой код:

if (window.cordova) {
    // hack to avoid double tap
    var lastTapTime = new Date().getTime();
    function tryToAvoidDoubleTap(e){
        var tapTime = e["timeStamp"];
        if (tapTime && (tapTime - lastTapTime) < 300) {
            // prevent double tap to happen
            e.stopImmediatePropagation();
            e.preventDefault();
            // jQM button handling
            if ($('.ui-btn').length)
                $('.ui-btn').removeClass('ui-btn-active');
            return false;
        }
        lastTapTime = tapTime;
    }

    // Wait for PhoneGap to load
    document.addEventListener("deviceready", onDeviceReady, false);

    // PhoneGap is ready
    function onDeviceReady() {
        document.addEventListener("touchend", tryToAvoidDoubleTap, true);
    }
}

Ответ 5

Я столкнулся с одной и той же проблемой, но мое приложение/игра нуждалась в том, чтобы пользователь мог дважды нажать на сенсорный экран. Таким образом, решение scirra, упомянутое выше, не использовалось, поскольку требуемая задержка в 500 или 1000 мс убивает двойную точку.

После некоторого рытья я заметил разницу между первым (пользовательским) краном и вторым (ошибка):

event.originalEvent.touches 

недоступен во втором ответвлении. Поэтому я написал этот помощник обнаружения ошибок, который решил мой случай:

function isDoubleTapBug (e) {
  // only handle touch events (in case your listener works on mouse events too)
  if (!'ontouchstart' in document.documentElement)) 
    return false;
  if (!e.originalEvent.touches) {
    e.preventDefault();
    e.stopPropagation();
    return true; // indicate to caller that it a bug
  }
  return false;
}

Затем в вашем слушателе сделайте следующее:

document.addEventListener('touchstart', function (e) {
  if (isDoubleTapBug(e))
    return false;
  // now do your actual event handling stuff...      
}