如何使用Android手机浏览器什么时候能得到持续的MouseMove事件？ [英] How to get continuous mousemove event when using android mobile browser?

问题描述

使用此code：

 ＆LT; H2 ID =状态＆GT;
0,0
＆LT; / H＆GT;

＆LT;脚本类型=文/ JavaScript的＆GT;
   $（HTML）。鼠标移动（功能（E）{
      $（'＃状态）HTML（e.pageX +，+ e.pageY）;
   }）;
＆LT; / SCRIPT＆GT;
 

在像Firefox窗口浏览器，它的确定看到鼠标现在的位置是当我移动鼠标，但是当我运行这个页面的Andr​​oid（2.1）的浏览器，我不能得到持续的事件，当我触摸屏幕，它只是触发当我点击屏幕的情况下，为什么呢？以及如何获得连续的鼠标移动事件，当我触摸屏？

解决方案

使用了 touchmove 事件，而不是（工作在我的Andr​​oid浏览器上的升级Froyo），虽然也有一些问题它 - 浏览器仅更新当触摸被释放的股利，但是该事件仍然烧成每一个接触的移动。这可以通过更改code将该证明：

 变种X = 0;
$（HTML）。绑定（touchmove'，功能（五）{
    $（'＃状态）HTML（X ++）;在触摸释放//只更新
}）;
 

这是因为在Android的浏览器 错误 - 你需要调用事件preventDefault（）来使这项工作按预期：

 变种X = 0;
$（HTML）。绑定（touchmove'，功能（五）{
    即preventDefault（）;
    $（'＃状态）HTML（X ++）;在触摸释放//只更新
}）;
 

官方错误信息：可以在这里

要检测当前的X和Y位置，你应该使用 event.touches 目标：

  $（窗口）.bind（'touchmove'，函数（jQueryEvent）{
   jQueryEvent preventDefault（）。
   VAR事件= window.event;
   $（'＃状态）HTML（'X ='+ event.touches [0] .pageX +'Y ='+ event.touches [0] .pageY）;
}）;
 

jQuery的创建它自己的版本的事件对象不具有原生浏览器的性能，如 .touches - 所以你需要使用 window.event 而不是

using this code:

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

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

In Windows browser like firefox, It's ok to see the mouse postion when I move mouse, but when I run this page in android(2.1) browser, I can not get the continuous event when I touch the screen, It just trigger the event when I tap the screen, why? and how to get the continuous mousemove event when I touch the screen?

解决方案

Use the touchmove event instead (works on my Android browser on Froyo), although there are some problems with it -- the browser only updates the div when the touch has been released, however the event is still fired for every touch movement. This can be demonstrated by changing the code to this:

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

This is due to a bug in the Android browser -- you need to call event.preventDefault() to make this work as expected:

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

Official bug details: available here

To detect the current X and Y position you should use the event.touches object:

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

jQuery creates it's own "version" of the event object which doesn't have the native browsers properties such as .touches -- so you need use window.event instead

这篇关于如何使用Android手机浏览器什么时候能得到持续的MouseMove事件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！