Html5 canvas 为什么kineticJS不能用触摸或鼠标移动工作？

我需要在触摸或鼠标移动屏幕白色部分时移动此“框”组

    <script defer="defer">
    var stage = new Kinetic.Stage({
        container: 'fullscreenDiv',
        width: 1180,
        height: 664
    });

    var layer = new Kinetic.Layer();

    var gamepart = new Kinetic.Rect({
        x: 0,
        y: 0,
        width: 1180,
        height: 500,
        stroke: 'black',
        strokeWidth: 4
    });

    var statuspart = new Kinetic.Rect({
        x: 0,
        y: 500,
        width: 1180,
        height: 164,
        fill: 'blue',
        stroke: 'black',
        strokeWidth: 4
    });

    var group = new Kinetic.Group({
        draggable: true,
        dragBoundFunc: function(pos) {
            return {
                x: pos.x,
                y: this.getAbsolutePosition().y
            }
        }
    });


    window.addEventListener('keydown', function(e) {
        if (e.keyCode == 37) //Left Arrow Key
            moveBoxes(-10);
        if (e.keyCode == 39) //Right Arrow Key
            moveBoxes(10);
        stage.draw();
    });

    function moveBoxes(pixels)
    {
        group.x(group.x() + pixels);
        stage.draw();
    }

    var oldPos = null;
    var touchPos = null;
    gamepart.on('touchmove mousemove', moving(stage.getPointerPosition()));


    function moving(mousePos){
        if(!oldPos)
            oldPos = stage.getPointerPosition();
        touchPos = mousePos;
        var x = touchPos.x - oldPos.x;
        moveBoxes(x);
    }
</script>

var阶段=新的动力学阶段({
容器：“fullscreenDiv”，
宽度：1180，
身高：664
});
var layer=新的动能层（）；
var gamepart=new dynamic.Rect({
x:0,，
y:0，
宽度：1180，
身高：500，
笔画：“黑色”，
冲程宽度：4
});
var statuspart=new dynamic.Rect({
x:0,，
y:500，
宽度：1180，
身高：164，
填充：“蓝色”，
笔画：“黑色”，
冲程宽度：4
});
var组=新的动力学组({
真的，
dragBoundFunc:函数（位置）{
返回{
x:pos.x，
y:this.getAbsolutePosition（）.y
}
}
});
window.addEventListener（'keydown'，函数（e）{
if（e.keyCode==37）//左箭头键
移动框（-10）；
if（e.keyCode==39）//右箭头键
移动箱（10）；
stage.draw（）；
});
功能移动框（像素）
{
组x（组x（）+像素）；
stage.draw（）；
}
var-oldPos=null；
var-touchPos=null；
on（'touchmove mousemove'，moving（stage.getPointerPosition（））；
功能移动（鼠标点）{
如果（！oldPos）
oldPos=stage.getPointerPosition（）；
touchPos=鼠标点；
var x=触摸位置x-旧位置x；
移动框（x）；
}

该组包含我添加的框。

---

按键箭头移动工作正常，可以在

中找到页面。我认为您希望对

'touchmove mousemove'

事件使用

函数

，这既不是函数的结果

gamepart.on('touchmove mousemove', function() {
    moving(stage.getPointerPosition())
});

---

现在当触摸和移动鼠标时会发生一些事情。但它不能正常工作。也许你们可以在我的链接上测试一下？你们能推荐一些我调试这段代码的方法吗？我认为最好的方法是-1。使底部矩形可拖动。2将

dragBoundFunc

函数设置为返回{0,0}的矩形（拖动时不移动rect）。3然后听

dragmove

event并在事件回调中执行您的操作。