文章/答案/技术大牛

发布

社区首页 >问答首页 >删除事件监听器

问删除事件监听器
EN

Stack Overflow用户

提问于 2013-10-16 20:02:15

回答 1查看 670关注 0票数 1

我试图理解如何使用Javascript添加和删除事件侦听器，但它并不像我所期望的那样工作。

我认为应该发生的是，当我把鼠标移到画布上时，它会启动控制台记录鼠标的x和y弦，但我也希望当我点击鼠标时，它应该停止记录和弦，而它不会.它只会让控制台记录这些和弦，直到我刷新页面。

这是我的html：

<!DOCTYPE html>
<html>
  <head>
    <title> My Canvas </title>
    <link rel="stylesheet" type="text/css" href="test_eventhandlers.css">
    <script src="test_eventhandlers.js" type="text/javascript"></script>    
  </head>
  <body>
    <canvas id="myCanvas" width="640" height="360"></canvas>
  </body>
</html>

这是我的javascript：

window.onload = function(){
  var myCanvas = document.getElementById("myCanvas");
  myCanvas.addEventListener('mousemove', consoleCoordsMouseMove, false);
  myCanvas.removeEventListener('click', consoleCoordsMouseMove, false);

  function consoleCoordsMouseMove(){
    var x=event.x;
    var y=event.y;
    console.log("mousemove: " + x + " and " + y);
  }
};

为什么这不管用？我尝试过一些其他的变体，但似乎没有任何效果。

javascript

dom-events

mouseevent

addeventlistener

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-10-16 20:14:39

这应该是可行的：

var myCanvas = document.getElementById("myCanvas");
myCanvas.addEventListener('mousemove', consoleCoordsMouseMove, false);
myCanvas.addEventListener('click', function () {
    this.removeEventListener('mousemove', consoleCoordsMouseMove, false);
}, false);

function consoleCoordsMouseMove(e) {
    var x = event.x;
    var y = event.y;
    console.log(x + ',' + y);
}

http://jsfiddle.net/Nmcgt/1/

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/19412695

复制

相似问题

问删除事件监听器
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问删除事件监听器EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问删除事件监听器
EN