Javascript event.wheelDelta返回未定义的值

所以当我的lightbox打开时，我试图禁用页面上的滚动，我发现这个非常有用的脚本可以做到这一点。（），不幸的是，当我在自己的页面上使用它时，它也禁用了我的lightbox中的滚动。我开始调试带有警报的代码，只是为了发现event.wheeldta在我的页面上返回“undefined”，而在中，它返回-120。

jQuery事件处理程序中的

事件

对象并不反映真实的事件

wheelDelta

是一种非标准的事件属性yie和Opera，可通过jQuery事件的

OriginaleEvent

属性获得

在jQuery1.7+中，

detail

属性在jQuery事件对象中不可用。因此，您还应该使用

event.originalEvent.detail

在

DOMMouseScroll

事件中为该属性添加属性。此方法与较旧的jQuery版本向后兼容

event.originalEvent.wheelDelta

演示：
另见：

然后像这样使用：

$('body').wheel(function (e) {
    e.preventDefault();
    $('#myDiv').append($('<div>').text(e.delta));
});

$（'body'）。控制盘（功能（e）{
e、 预防默认值（）；
$（'#myDiv'）.append（$（''）.text（e.delta））；
});

---

大thx到@Mark用于jquery函数（：

我已经尝试了您的解决方案，并且我已经更改了函数

extracteddelta（e）

使其在Firefox中工作。我没有使用

e.detail

而是使用了

e.originalEvent.detail

，因为Firefox返回了一个未定义的增量。我已经将解决方案和测试代码上传到了其中。我希望它能有所帮助

function extractDelta(e) {
    if (e.wheelDelta) {
        return e.wheelDelta;
    }

    if (e.originalEvent.detail) {
        return e.originalEvent.detail * -40;
    }

    if (e.originalEvent && e.originalEvent.wheelDelta) {
        return e.originalEvent.wheelDelta;
    }
}

---

在Webkit和FF中工作，无法在此处证明IE:（

当我需要WheelDelta时，我将事件传递给这个小宝石

function getWheelDelta(event) {
    return event.wheelDelta || -event.detail || event.originalEvent.wheelDelta || -event.originalEvent.detail || -(event.originalEvent.deltaY * 25) || null;
}

示例jQuery，其中我使用它获取带有

overflow:hidden

CSS规则的滚动元素的增量

$('#parent-id').on('wheel mousewheel DOMMouseScroll', function(event) {
    var node = $('#child-id');
    node.prop('scrollTop', parseFloat(node.prop('scrollTop')) - (getWheelDelta(event) / 2));
    return false;
});

---

注意：通过添加增量而不是像上面的例子那样进行减法来反转滚动方向。

我也遇到过类似的问题，它涉及到dom名称空间。你能展示一些代码吗，或者只是再次检查一下你的名字和id，答案可能就在那里。你是个天才！我已经研究过很多其他解决方案，你的小提琴是唯一一个可以解决这个问题的解决方案t进入根目录并实际工作！感谢您节省了大量时间。在最新的Firefox中不工作。在此处找到隐藏的增量：

if（e.originalEvent&&e.originalEvent.deltaY）return e.originalEvent.deltaY*-40

@Mark修复了它，现在应该可以工作了..我希望jquery有某种通用的delta，我讨厌这种跨浏览器的东西是的，我不知道为什么jquery核心中不会有这种东西。我用它做了一个函数：在FF和Chrome中工作，在IE8中还没有工作。很好，你介意我在中替换代码吗我的答案与你的轮功能？它更优雅。或者继续编辑我的答案..“细节”似乎不存在于最新的Firefox中。它似乎现在被分为deltaX、Y和Z。嗨，马克。我刚刚在Mac上的Firefox 27.0.1中测试了这段代码，我检查了鼠标轮返回的事件。它仍然包含“originalEvent”元素，在其中，您可以找到“detail”"元素。我一直在检查它的值，它仍然有效。如果你前后移动车轮，它会改变它的符号，它会根据车轮的速度改变它的值。我得到了正常值：1，-1，2，-1，-4，1…我不知道你到底在哪里发现了问题。注意到有人说类似的事件在FF.Co中不起作用也在我的代码中确认。一旦我有一个确认的解决方案更新，包括Firefox的

event.originalEvent.deltaY

，我将立即更新

getWheelDelta

。速度乘以25，因为它为每个车轮事件注册了1+/-。

function getWheelDelta(event) {
    return event.wheelDelta || -event.detail || event.originalEvent.wheelDelta || -event.originalEvent.detail || -(event.originalEvent.deltaY * 25) || null;
}

$('#parent-id').on('wheel mousewheel DOMMouseScroll', function(event) {
    var node = $('#child-id');
    node.prop('scrollTop', parseFloat(node.prop('scrollTop')) - (getWheelDelta(event) / 2));
    return false;
});