touchEvent.touches.length всегда возвращает 1 на Android

Я впервые имею дело с сенсорными устройствами, и для реализации некоторых основных функций на моем веб-сайте / в веб-приложении мне необходимо управлять сенсорными событиями.

В процессе моего приложения, после динамического создания div, я присоединяю к нему событие touchstart, вызывающее функцию, в которой я хочу управлять различными задачами по количеству одновременных касаний: для этого я подумал использовать touchEvent Свойство.changedTouches.length
( https://developer.mozilla.org/en-US/docs/Web/API/TouchEvent/changedTouches).

У меня есть что-то вроде этого:

$("body").append("<div id='myDiv'>Some text...</div>");
touchEvents();
...
function touchEvents() {
    var touches;
    $("#myDiv").on("touchstart", function (e) {
        touches = e.changedTouches;
        alert(touches.length);
        switch (touches.length) {
            case 1:
            {code_block_1}
            break;
            case 2:
            {code_block_2}
            break;
            default:
            {code_block_default}
        }
    });
}
...

Когда я запускаю его с Safari на Ios (IPad 2), если я касаюсь его одним, двумя (или более - до 9) пальцами, я получаю из оповещения правильное количество использованных пальцев и тогда приложение корректно запускается, если я сделал касание двумя пальцами, в корпус переключателя: 2.

Но когда я использую устройство Android (я тестировал его на телефонах Samsung и NGM - либо на старых, либо на новейших телефонах Android - либо с обновленными Firefox и Chrome), я всегда получаю "1" при помощи alert(), вызываемого сразу после touchstart событие, даже если я использую более одного пальца; следовательно, маршрут всегда идет внутри корпуса коммутатора: 1 вариант.

Я обнаружил, что это происходит из-за странного поведения в списке touchEvent.touches.

На самом деле, если у меня есть следующий код

$("body").append("<div id='myDiv'>Some text...</div>");
touchEvents();
...
function touchEvents() {
    var touches;
    $("#myDiv").on("touchstart", function (e) {
        touches = e.touches;
        alert(touches.length);
        ...
    });
}

если я касаюсь поверхности двумя пальцами (одновременно или один за другим), я всегда получаю два предупреждения!

(когда пальцы опускаются один за другим, я также получаю первое предупреждение правильно, говоря "1")...

Первый (второй в случае, когда касание двумя пальцами не является одновременным) запрашивает "2", но сразу после закрытия этого предупреждения запускается другой, запрашивающий "1".

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

https://developer.mozilla.org/en-US/docs/Web/API/TouchEvent/touches

добавив три функции, которые предупреждают e.touches.length т.е.

$(document).ready(function() {
    document.getElementById("test").addEventListener('touchstart', function(e) {
        // Invoke the appropriate handler depending on the
        // number of touch points.
        switch (e.touches.length) {
            case 1: handle_one_touch(e); break;
            case 2: handle_two_touches(e); break;
            case 3: handle_three_touches(e); break;
            default: console.log("Not supported"); break;
        }
    }, false);
    function handle_one_touch(e) {
        touches = e.touches;
        alert(touches.length);
    }
    function handle_two_touch(e) {
        touches = e.touches;
        alert(touches.length);
    }
    function handle_three_touch(e) {
        touches = e.touches;
        alert(touches.length);
    }
});

и я всегда получаю "1", поэтому она всегда вызывается только функцией handle_one_touch(e).

Как следствие, я думаю, что свойство changeTouches.length всегда равно 1.

Кто-нибудь знает, есть ли известная проблема по этому вопросу на устройствах Android и / или как ее решить?
Заранее спасибо, Федерико

0 ответов

Другие вопросы по тегам