Как получить непрерывное событие mousemove при использовании мобильного браузера Android?

используя этот код:

<h2 id="status">
0, 0
</h2>

<script type="text/javascript">
   $('html').mousemove(function(e){
      $('#status').html(e.pageX +', '+ e.pageY);
   }); 
</script>

В браузере Windows, таком как firefox, нормально видеть перемещение мыши при перемещении мыши, но когда я запускаю эту страницу в браузере android (2.1), я не могу получить непрерывное событие, когда касаюсь экрана, он просто запускает что происходит, когда я нажимаю экран, почему? и как получить непрерывное событие mousemove, когда я касаюсь экрана?

Ответ 1

Используйте событие touchmove вместо этого (работает в моем Android-браузере на Froyo), хотя есть некоторые проблемы с ним - браузер обновляет div только тогда, когда сенсорный режим был выпущен, однако событие все еще запущено для каждого движение касания. Это можно продемонстрировать, изменив код на это:

var x = 0;
$('html').bind('touchmove', function(e) {
    $('#status').html(x++); // Only updates on touch release
});

Это связано с ошибкой в браузере Android - вам нужно позвонить event.preventDefault(), чтобы сделать эту работу ожидаемой:

var x = 0;
$('html').bind('touchmove', function(e) {
    e.preventDefault();
    $('#status').html(x++); // Only updates on touch release
});

Официальная информация об ошибке: доступна здесь

Чтобы определить текущую позицию X и Y, вы должны использовать объект event.touches:

$(window).bind('touchmove', function(jQueryEvent) {
   jQueryEvent.preventDefault();
   var event = window.event;
   $('#status').html('x='+event.touches[0].pageX + '  y= ' + event.touches[0].pageY);
});

jQuery создает собственную "версию" объекта события, которая не имеет собственных свойств браузеров, таких как .touches - поэтому вам нужно использовать window.event вместо

Ответ 2

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

<div id="status">x, y</div>
<script>
    $('html').on("mousemove touchmove", function(e){
        $('#status').html(e.pageX +', '+ e.pageY);
        e.preventDefault();
    });
</script>