addEventListener 未使用其功能

Question

基本上，只要有人点击 "createTextButton"，"currentTool" 就会切换到与该按钮关联的功能。然后，当有人在绘图表面上单击时，分配给 currentTool 的函数应该由 addEventListener 调用，但事实并非如此。

我是不是漏掉了什么？ Mozilla 文档说 AddEventListener 可以接收一个对象或函数作为它的第二个参数。在 Node.JS，我一直使用这样的回调。这里有什么不同吗？

 var currentTool = null;

 var svg = document.getElementById("drawing-surface");

 var createTextButton = document.getElementById("createTextButton");

 createTextButton.addEventListener("mouseup", function(event) {
     currentTool = createText;
 });

 svg.addEventListener("mouseup", currentTool);

 function createText(event) {
     ...
 }

Answer 1

您正在将 null 传递给 svg.addEventListener。给出的值是函数调用时变量的值；如果以后改了，也不影响。

要实现您想要的效果，您可以将事件侦听器包装在另一个函数中：

svg.addEventListener("mouseup", function(event) {
  if(currentTool != null)
    currentTool(event);
});

这是可行的，因为现在我们每次事件发生时都引用变量 currentTool ，而不是仅在调用 addEventListener 时引用变量。

addEventListener 未使用其功能

addEventListener not using its function

javascript

events

frontend