禁用预测滚动-鼠标滚轮(OnScroll)事件触发次数过多(触摸板) [英] Disable Predictive Scrolling - Mousewheel (OnScroll) Event fires too often (Touchpad)

问题描述

我正在执行Javascript onScroll. 我的代码可以在任何普通的计算机鼠标上正常工作，但是当我使用笔记本的触摸板时，会遇到以下情况:

• 当手指移动方向盘时，我的鼠标触发(大约1到8)mousewheel事件.
• 当两个手指触摸触摸板时，我的触摸板会触发更多(〜60)mousewheel事件，并且当我的手指再次悬空时会继续触发.

我从移动触摸设备知道这种行为.该功能称为"Predictive Touch"(预测性触摸)-如果在抬起手指之前，手指的移动具有足够的加速度，滚动就会继续.

我认为触摸板驱动程序正在设置这种平滑滚动"行为.

要调试这种情况，我使用了以下代码:

/* Handle Mouse-Wheel Scrolling */
var lastChange = +new Date();
$(window).bind('mousewheel',    function(e){
    console.log("mw");
    if(+new Date() - lastChange > 1000){
        console.log("mw allowed");
        if(e.originalEvent.wheelDelta > 0)  {/*go to previous*/}
        else{   /*go to next*/}
        lastChange = +new Date();
    }
return false;});

这是一个简单的代码，每秒允许"鼠标滚动事件.

如果我进行快速触摸板滚动，则触发mousewheel事件约300次.一秒钟的条件是让3个事件发生.我的手指在触摸板上的时间不到一秒钟.

通过该测试，我发现mousewheel事件仍然被触发(几乎连续3秒)，即使我的手指已经离开触摸板也是如此.

是否有Javascript函数或解决方法/技巧/黑客来避免此行为?

可能类似于触摸板的onTouchEnd事件?

解决方案

要实现此目的，您必须区分鼠标滚动事件和触摸板事件，但使用JavaScript尚不可能.已经有人问过如何捕获触摸板输入.

指针事件当前处于编辑器草稿状态，尚不受任何浏览器支持.另请参见在MDN上的触摸事件文档.

I am executing Javascript onScroll. My code works great with any normal computer mouse, but when I use my notebook's touchpad, I encounter the following situation:

• my mouse fires (about 1 to 8) mousewheel events while the finger is moving the wheel.
• my touchpad fires a lot more (~60) mousewheel events while the two fingers are touching the pad and continues to fire after my fingers are up in the air again.

I know this behavior from mobile touch devices. The Feature is called "Predictive Touch" - The Scrolling continues if your finger movement had enough acceleration before lifting it up.

I think the touchpad drivers are setting this "smooth scrolling" behavior.

To debug this case, I have used the following code:

/* Handle Mouse-Wheel Scrolling */
var lastChange = +new Date();
$(window).bind('mousewheel',    function(e){
    console.log("mw");
    if(+new Date() - lastChange > 1000){
        console.log("mw allowed");
        if(e.originalEvent.wheelDelta > 0)  {/*go to previous*/}
        else{   /*go to next*/}
        lastChange = +new Date();
    }
return false;});

This is a simple code that "allows" a mouse-scrolling-event every second.

If I make a fast touchpad-scroll, the mousewheel event is fired ~300 times. The one-second-condition is letting 3 events happen. My fingers were on the touchpad for far less than a second.

With this test, I discovered that the mousewheel events are still fired (almost continuously for 3 seconds), even when my fingers are already off the touchpad.

Is there a Javascript function or a workaround / trick / hack to avoid this behavior?

Something like a onTouchEnd event for touchpads, maybe?

解决方案

To achieve this, you'd have to distinguish between mouse scroll events and touchpad events, which is not (yet) possible using JavaScript. It was already asked in question How to capture touch pad input.

Pointer Events are currently in state of Editor's Draft and not yet supported by any browser. See also touch events docs on MDN.

这篇关于禁用预测滚动-鼠标滚轮(OnScroll)事件触发次数过多(触摸板)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！