Javascript 未触发中的鼠标滚轮事件

我在项目中使用Kinetijs，并尝试使用

mousewheel

实现缩放。我不知道为什么这个事件没有被触发。我正在这样做：

//... a helper object for zooming
var zoomHelper = {
    stage: null,
    scale: 1,
    zoomFactor: 1.1,
    origin: {
        x: 0,
        y: 0
    },
    zoom: function(event) {
        event.preventDefault();
        var delta;
        if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1) {
            if (event.originalEvent.detail > 0) {
                //scroll down
                delta = 0.2;
            } else {
                //scroll up
                delta = 0;
            }
        } else {
            if (event.originalEvent.wheelDelta < 0) {
                //scroll down
                delta = 0.2;
            } else {
                //scroll up
                delta = 0;
            }
        }
        var evt = event.originalEvent,
            mx = evt.clientX - zoomHelper.stage.getX(),
            my = evt.clientY - zoomHelper.stage.getY(),
            zoom = (zoomHelper.zoomFactor - delta),
            newscale = zoomHelper.scale * zoom;
        zoomHelper.origin.x = mx / zoomHelper.scale + zoomHelper.origin
            .x - mx / newscale;
        zoomHelper.origin.y = my / zoomHelper.scale + zoomHelper.origin
            .y - my / newscale;
        zoomHelper.stage.setOffset({
            x: zoomHelper.origin.x,
            y: zoomHelper.origin.y
        });
        zoomHelper.stage.setScale({
            x: newscale,
            y: newscale
        });
        zoomHelper.stage.draw();
        zoomHelper.scale *= zoom;
    }
};

$(function() {
    var width = $(document).width() - 2,
        height = $(document).height() - 5;
    var stage = zoomHelper.stage = new Kinetic.Stage({
        container: 'container',
        width: width,
        height: height,
        draggable: true
    });
    var layer = new Kinetic.Layer();
    
    var background=new Kinetic.Rect({
        x:0,
        y:0,
        width: width,
        height: height,
        fill:'#E4E4E4'
    });

    var box1 = new Kinetic.Circle({
        x: 50,
        y: 50,
        radius: 50,
        fill: '#00D200',
        stroke: 'black',
        strokeWidth: 2,
        draggable: true
    });
    
    var box2  = new Kinetic.Circle({
        x: 150,
        y: 150,
        radius: 50,
        fill: 'red',
        stroke: 'black',
        strokeWidth: 2,
        draggable: true
    });
    
    // add cursor styling
    box1.on('mouseover', function() {
        document.body.style.cursor = 'pointer';
    });
    box1.on('mouseout', function() {
        document.body.style.cursor = 'default';
    });
    
    // add cursor styling
    box2.on('mouseover', function() {
        document.body.style.cursor = 'pointer';
    });
    box2.on('mouseout', function() {
        document.body.style.cursor = 'default';
    });

    layer.add(background);
    layer.add(box1);
    layer.add(box2);
    stage.add(layer);

    $(stage.content).on('mousewheel DOMMouseScroll', zoomHelper.zoom);
});

/。。。用于缩放的辅助对象
变量zoomHelper={
阶段：空，
比例：1，
zoomFactor:1.1，
来源：{
x:0,，
y:0
},
缩放：功能（事件）{
event.preventDefault（）；
var三角洲；
if（navigator.userAgent.toLowerCase（）.indexOf（'firefox'）>-1）{
如果（event.originalEvent.detail>0）{
//向下滚动
δ=0.2；
}否则{
//向上滚动
δ=0；
}
}否则{
if（event.originalEvent.wheelDelta<0）{
//向下滚动
δ=0.2；
}否则{
//向上滚动
δ=0；
}
}
var evt=event.originalEvent，
mx=evt.clientX-zoomHelper.stage.getX（），
my=evt.clientY-zoomHelper.stage.getY（），
zoom=（zoomHelper.zoomFactor-增量），
newscale=zoomHelper.scale*zoom；
zoomHelper.origin.x=mx/zoomHelper.scale+zoomHelper.origin
.x-mx/新闻级；
zoomHelper.origin.y=my/zoomHelper.scale+zoomHelper.origin
.y-我的/新闻量表；
zoomHelper.stage.setOffset({
x:zoomHelper.origin.x，
y:zoomHelper.origin.y
});
zoomHelper.stage.setScale({
x：新闻级，
y:新音阶
});
zoomHelper.stage.draw（）；
zoomHelper.scale*=缩放；
}
};
$（函数（）{
变量宽度=$（文档）.width（）-2，
高度=$（文档）.height（）-5；
var阶段=zoomHelper.阶段=新的动力学阶段({
容器：'容器'，
宽度：宽度，
高度:高度,，
德拉格布尔：是的
});
var layer=新的动能层（）；
var background=new dynamic.Rect({
x:0,，
y:0，
宽度：宽度，
高度:高度,，
填写：“#e4”
});
var box1=新的动力学圆({
x:50，
y:50，
半径：50，
填写：“#00D200”，
笔画：“黑色”，
冲程宽度：2，
德拉格布尔：是的
});
var box2=新的动力学圆({
x:150，
y:150，
半径：50，
填充：“红色”，
笔画：“黑色”，
冲程宽度：2，
德拉格布尔：是的
});
//添加光标样式
框1.on（'mouseover'，function（）{
document.body.style.cursor='pointer'；
});
框1.on（'mouseout'，function（）{
document.body.style.cursor='default'；
});
//添加光标样式
框2.on（'mouseover'，function（）{
document.body.style.cursor='pointer'；
});
框2.on（'mouseout'，function（）{
document.body.style.cursor='default'；
});
图层。添加（背景）；
添加图层（框1）；
添加图层（第2框）；
阶段。添加（层）；
$（stage.content）.on（'mouseweel-DOMMouseScroll'，zoomHelper.zoom）；
});

---

我已经为此创造了。我不知道出了什么问题。请帮助。

鼠标滚轮

事件正在进行中。使用

wheel

事件，它将正常工作：

/。。。用于缩放的辅助对象
变量zoomHelper={
阶段：空，
比例：1，
zoomFactor:1.1，
来源：{
x:0,，
y:0
},
缩放：功能（事件）{
event.preventDefault（）；
var三角洲；
if（navigator.userAgent.toLowerCase（）.indexOf（'firefox'）>-1）{
如果（event.originalEvent.detail>0）{
//向下滚动
δ=0.2；
}否则{
//向上滚动
δ=0；
}
}否则{
if（event.originalEvent.wheelDelta<0）{
//向下滚动
δ=0.2；
}否则{
//向上滚动
δ=0；
}
}
var evt=event.originalEvent，
mx=evt.clientX-zoomHelper.stage.getX（），
my=evt.clientY-zoomHelper.stage.getY（），
zoom=（zoomHelper.zoomFactor-增量），
newscale=zoomHelper.scale*zoom；
zoomHelper.origin.x=mx/zoomHelper.scale+zoomHelper.origin
.x-mx/新闻级；
zoomHelper.origin.y=my/zoomHelper.scale+zoomHelper.origin
.y-我的/新闻量表；
zoomHelper.stage.setOffset({
x:zoomHelper.origin.x，
y:zoomHelper.origin.y
});
zoomHelper.stage.setScale({
x：新闻级，
y:新音阶
});
zoomHelper.stage.draw（）；
zoomHelper.scale*=缩放；
}
};
$（函数（）{
变量宽度=$（文档）.width（）-2，
高度=$（文档）.height（）-5；
var阶段=zoomHelper.阶段=新的动力学阶段({
容器：'容器'，
宽度：宽度，
高度:高度,，
德拉格布尔：是的
});
var layer=新的动能层（）；
var background=new dynamic.Rect({
x:0,，
y:0，
宽度：宽度，
高度:高度,，
填写：“#e4”
});
var box1=新的动力学圆({
x:50，
y:50，
半径：50，
填写：“#00D200”，
笔画：“黑色”，
冲程宽度：2，
德拉格布尔：是的
});
var box2=新的动力学圆({
x:150，
y:150，
半径：50，
填充：“红色”，
笔画：“黑色”，
冲程宽度：2，
德拉格布尔：是的
});
//添加光标样式
框1.on（'mouseover'，function（）{
document.body.style.cursor='pointer'；
});
框1.on（'mouseout'，function（）{
document.body.style.cursor='default'；
});
//添加光标样式
框2.on（'mouseover'，function（）{
document.body.style.cursor='pointer'；
}
$(stage.content).on('mousewheel DOMMouseScroll', zoomHelper.zoom);

$(stage.container).on('mousewheel DOMMouseScroll', zoomHelper.zoom);