使用Android手機瀏覽器時，如何獲得持續mousemove事件？

使用此代碼：使用Android手機瀏覽器時，如何獲得持續mousemove事件？

<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）瀏覽器這個頁面，我不能得到持續當我觸摸屏幕時，它會在我點擊屏幕時觸發事件，爲什麼？以及當我觸摸屏幕時如何獲得持續的鼠標移動事件？

來源

2011-06-11 zhongshu

可能是因爲它試圖拖動屏幕，而不是你的位置？ – 2011-06-11 15:09:50

改爲使用touchmove事件（適用於我在Froyo上的Android瀏覽器中），儘管它存在一些問題 - 瀏覽器僅在觸摸已釋放時更新div，但事件仍會針對每次觸摸運動。這可以通過代碼更改爲此證明：

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

這是由於bug in the Android browser - 你需要調用event.preventDefault()，使這項工作按照預期：

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

官方bug詳細信息：available here

檢測當前的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代替

來源

2011-06-11 15:16:01

我想這一點，但不能讓X和Y使用現在的位置windows.event，似乎使用jQueryEvent.pageX和pageY是確定的。無論如何，謝謝你的回答。 – zhongshu 2011-06-17 01:35:49

我只想提的是，錯誤不會只發生在Android瀏覽器，而Chrome（PC）爲好。我不喜歡的一件事是它也停止了其他非常糟糕的'touchmove'事件。 – 2014-03-24 01:23:00

閱讀接受的答案，也許是爲了應對正在進行的事件觸摸和鼠標這樣的事情最好的辦法後？

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

來源

2013-01-22 17:55:32 Luke

您需要使用空格來分隔事件而不是'，'。 '。對（「鼠標移動touchmove」，函數（）{..' – 2013-05-25 13:45:06

謝謝，這總是讓我！上面固定。 – Luke 2013-06-06 23:14:57

使用Android手機瀏覽器時，如何獲得持續mousemove事件？

回答

相關問題