Question

我有以下函数，我从我的一个javascript代码中传递一个canvas元素：

function addMouseHandler(canvas) {
    console.log(canvas); //first console log for logging canvas
    canvas.addEventListener('mousemove', function (e) {
        onMouseMove(e);
    }, false);
    canvas.addEventListener('mousedown', function (e) {
        console.log('here'); //second log for logging we are inside event listener
        onMouseDown(e);
    }, false);
    canvas.addEventListener('mouseup', function (e) {
        onMouseUp(e);
    }, false);
}

如果我不在我的代码中添加AngularJS，这可以正常工作。但是在我添加AngularJS之后，代码不会进入任何addEventListener（）方法。

我的代码仍会记录第一个console.log（）并正确记录我的canvas元素：

<canvas width="945" height="550" id="mycanvas"></canvas>

但现在它不会进入addEventListener（）方法。我使用console.log（'here'）检查了它，但从未调用过它。

更新：我刚刚将ng-app =“myApp”添加到我的body元素<body ng-app="myApp">，然后此addEventListener停止工作。我的代码中没有其他任何角色。

Answer 1

好的发现了问题......我有2次声明控制器...一次在ng-controller中，另一次在myApp.controller（）中。所以我的画布被创建了两次，鼠标listerners搞砸了。

添加AngularJS后，添加鼠标处理程序无法正常工作

1 个答案: