如何返回事件侦听器调用的函数的值

How do I return the values of a function that's called by an event listener?

本文关键字:调用 侦听器 函数 事件 何返回 返回      更新时间:2023-09-26

我希望"getPosition"计算的坐标可用于其他函数,这样我就不必在getPosition中编写使用x和y的其余代码。

我知道我可以使用类似 return {posX: x, posY: y} 的东西来从函数中检索这两个值,但我不知道如何在 getPlace 之外使它们可用。

document.addEventListener("DOMContentLoaded", init, false);
  function init()
  {
    var canvas = document.getElementById("canvas");
    canvas.addEventListener("mousedown", getPosition, false);
  }
   function getPosition(event)
  {
    var x = new Number();
    var y = new Number();
    var canvas = document.getElementById("canvas");
    if (event.x != undefined && event.y != undefined)
    {
      x = event.x;
      y = event.y;
    }
    else // Firefox method to get the position
    {
      x = event.clientX + document.body.scrollLeft +
          document.documentElement.scrollLeft;
      y = event.clientY + document.body.scrollTop +
          document.documentElement.scrollTop;
    }
    x -= canvas.offsetLeft;
    y -= canvas.offsetTop;
  }

创建一个闭包,并将变量 x 和 y 以及使用它们的函数放在那里:

(function(){
  var _x = 0;
  var _y = 0;
  document.addEventListener("DOMContentLoaded", init, false);
  function init()
  {
    var canvas = document.getElementById("canvas");
    canvas.addEventListener("mousedown", getPosition, false);
  }
   function getPosition(event)
  {
    var x = new Number();
    var y = new Number();
    var canvas = document.getElementById("canvas");
    if (event.x != undefined && event.y != undefined)
    {
      x = event.x;
      y = event.y;
    }
    else // Firefox method to get the position
    {
      x = event.clientX + document.body.scrollLeft +
          document.documentElement.scrollLeft;
      y = event.clientY + document.body.scrollTop +
          document.documentElement.scrollTop;
    }
    x -= canvas.offsetLeft;
    y -= canvas.offsetTop;
    //Save x and y for later
    _x = x;
    _y = y;
  }
})();