How to return value from addEventListener

Question

I use Javascript to catch the x and y position for when user clicks a link.

I can make it work, but I want it to return the two values to function init() when it is called.

How can I do it?

<script type="text/javascript">

  document.addEventListener("DOMContentLoaded", init, false);

  function init()
  {
    var canvas = document.getElementById("canvas");
    canvas.addEventListener("mousedown", getPosition, false);
    
    // how can I get the return values here?

  }

  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
    {
      x = event.clientX + document.body.scrollLeft +
          document.documentElement.scrollLeft;
      y = event.clientY + document.body.scrollTop +
          document.documentElement.scrollTop;
    }

    x -= canvas.offsetLeft;
    y -= canvas.offsetTop;

    alert("x: " + x + "  y: " + y); // here can print the correct position
    
    // if I add the two values here, and return them. How can I receive the values in funciton init()
    // var clickPosition={"x":x, "y":y};
    // return clickPosition;
  }

</script>

Answer 1

Where you have the comment, you will never be able to access the variables, the event has not occurred yet.

Instead, what you can do is pass an anonymous function to the event handler, call your method which returns a value and use it as appropriate

function init()
{
    var canvas = document.getElementById("canvas");
    canvas.addEventListener("mousedown", function(event){
        var result = getPosition(event);

        // result is your return value
    }, false);

}

Answer 2

You can't.

JavaScript isn't capable of time travel.

The event handler function won't run until the event happens. By that time, the function that called addEventHandler will have finished running and returned.

The event handler function needs to either deal with the data itself, or call other functions to do it. The data has to travel forwards, it can't go back.