В Windows Phone событие IE Touchstart заканчивается автоматически через несколько секунд

Question

У меня очень специфическая проблема. Я пишу веб-страницу для мобильных телефонов, на которой есть кнопка. Я обнаруживаю touchevent в любом браузере, включая IE, но в IE это довольно специфично. Через несколько секунд это автоматически заканчивается. Вы можете мне как-то помочь? Вот мой код (модифицированный, но все еще не работает должным образом):

if (window.navigator.pointerEnabled) {
    tapButton.addEventListener("pointerup", function(e) {
        e.preventDefault();
        addClass(this, 'clicked');
        buttonTouched = true;
    }, false);
    tapButton.addEventListener("pointerdown", function(e) {
        e.preventDefault();
        removeClass(this, 'clicked');
        buttonTouched = false;
    }, false);
    alert("pointerEnabled");
}
else if (window.navigator.msPointerEnabled) {
    tapButton.addEventListener("MSPointerDown", function(e) {
        e.preventDefault();
        addClass(this, 'clicked');
        buttonTouched = true;
    }, false);
    tapButton.addEventListener("MSPointerUp", function(e) {
        e.preventDefault();
        removeClass(this, 'clicked');
        buttonTouched = false;
    }, false);
    alert("mspointerEnabled");
}
else {
    alert("ordinary touch");
    tapButton.addEventListener('touchstart', function(e) {
        e.preventDefault();
        addClass(this, 'clicked');
        buttonTouched = true;
    }, false);
    tapButton.addEventListener('touchend', function(e) {
        e.preventDefault();
        removeClass(this, 'clicked');
        buttonTouched = false;
    }, false);
}

И тег html имеет в нем:

-ms-touch-action: none !important;
touch-action: none !important;

но это тоже не помогает.

Answer 1

Я подозреваю, что вы столкнулись с проблемой мультитач...

Помните, что события касания не совпадают с событиями мыши. Вы можете коснуться более чем одним пальцем. Что произойдет, если вы дотронетесь одним пальцем, чем добавите второй? Вы получаете два подряд touchstart События. То же самое, вероятно, верно для touchend, Я подозреваю пользователя light верно, что это, вероятно, вызывает неверное отпускание пальца...

Пожалуйста, посмотрите, что происходит с touches, changedTouches а также targetTouches свойства TouchEvent вы получаете в своем слушателе. Я сильно подозреваю, что вы увидите, что до сих пор остается "касание пальцем"... Таким образом, оно перешло от 2 касаний к 1...

Убедиться, что (больше не) касающийся палец на самом деле тот, который находится на кнопке и т. Д., Все гораздо проще, чем старый добрый mouseup а также mousedown события были.

РЕДАКТИРОВАТЬ: я понимаю, что ваша проблема с IE, и это события указателя... Однако они работают в основном одинаково в том, что они также поддерживают мультитач (и, следовательно, могут страдать от тех же проблем). Я не вижу собственности, сродни touchesно я вижу pointerId, который может дать вам ту же информацию (за счет некоторой бухгалтерии на вашем конце).

На этой странице MSDN есть хорошая информация. Особенно этот фрагмент кода является поучительным, я думаю:

function pointerdownHandler(evt) {
      evt.target.setPointerCapture(evt.pointerId);
}

Похоже, это подтверждает, что когда палец касается поверхности, точка контакта получает идентификатор, который используется для информирования вас о том, какой палец покинул поверхность, когда вы получаете pointerup событие.

Я бы добавил некоторые записи, которые просто печатает pointerId на pointerdown а также pointerup Бьюсь об заклад, вы быстро найдете свое решение.