I’ve been working on a Space Invaders style game with the request from the client that it be “developed in HTML5 and works in IE8”.(!!) A bit of a contradiction in terms. Google Chrome Frame seemed like a possible solution until they told me that no new software/plugins could be installed(and it’s goodbye to chrome frame anyway shortly).
For an event handler to retain its scope, you need to specify its scope, for example:
But what this actually does is replicate the function bound to the instance. Even if the function is part of the object, it doesn’t retain its scope.
This took me a while to work out, but if you try to remove the event listener, neither of the following two lines work:
this.getStage().removeEventListener('click', this.onMouseDown); this.getStage().removeEventListener('click', this.onMouseDown.bind(this));
Because neither of them actually refer to the original function created by the bind function, you need to actually create a new variable to begin with, containing the bound function, and then later when removing the event listener, refer to this variable:
this.onMouseDownBound = this.onMouseDown.bind(this); this.getStage().addEventListener('click', this.onMouseDownBound); ... this.getStage().removeEventListener('click', this.onMouseDownBound);