Question

About a month ago, I asked a question on how to properly set events for dynamic XUL elements. Now that I know how to set them up, I’m wondering about what needs to be done when tearing them down. Should I be using element.removeEventListener() when the dynamically created elements (toolbar buttons and menu items in my case) are removed? Supposing the event listeners are created as shown below, how do I beset get a reference to the listener so it can be cleaned up?

tempMenuItem.addEventListener("command", function(event)
{
  myObject.someFunction();
}, false);

Are there any other gotchas in this process I should be aware of?

Answer 1

Normally, the event listeners are cleaned up automatically and you don’t need to worry about removing them by hand. If you ever happen to want to remove an event listener, the right way to do this is:

var theListener = function (event) { ... };
item.addEventListener("command", theListener, false);
item.removeEventListener("command", theListener, false);

Don’t forget to make sure the third parameter matches in both calls 🙂