title: Click event happens during a lot of frames
body: <p>The Javascript click event is added to a lot of frames in my app.
  I need the click event to happen only once, not 200 frames. The frames seem to stack each other, adding even more frames for each click.
  How can I make it so that it only happens once?</p>
  
  <p>Here is the event code:</p>
  
  <pre><code>    function a(e){
          var x = e.clientX - ctx.canvas.offsetLeft;
          var y = e.clientY - ctx.canvas.offsetTop;
  
          if(x &gt;= initialScreen.x &amp;&amp; x &lt;= initialScreen.x + initialScreen.width
              &amp;&amp; y &gt;= initialScreen.y &amp;&amp; y &lt;= initialScreen.y + initialScreen.height){
              ctx.canvas.removeEventListener('click',a,false);
              quit = true;
          }
          else if(x &gt;= left.x &amp;&amp; x &lt;= left.x + left.width 
              &amp;&amp; y &gt;= left.y &amp;&amp; y &lt;= left.y + left.height){
              ctx.canvas.addEventListener('click', a, false);
              player.x += 5;
          }
      }
  
      // Add the click event using the previous function
      ctx.canvas.addEventListener('click', a, false);
  </code></pre>