Question

I’ve got a button with an onclick event listener attached (in MooTools). It works fine. However, I want to be able to make the button unavailable at a certain time, and make it available again when necessary.

Simply put: I want to ‘suspend’ the event listener. Can this be done? The MooTools docs only go into adding, removing, cloning and propagation of events. Not ‘ignoring’ them for a while.

I understand the solution for this can lie elsewhere:

1. Hide the button with some css, e.g. $('button').setStyle('visibility', 'hidden') and let it show up again later
2. Some overlay, again hiding the original element, and showing a substitute (grayed out button for instance)
3. Cloning the element, removing all the events from the original (making the button ‘unavailable’), then replace the original with the clone (thus making it available again)
4. Let the function attached to the event listener check if the button is available or not

However, this is a bit beside the point and seems more elaborate then necessary. My question is if and how I can control the event listener, basically: can I suspend it?

EDIT:

I guess the answer is ‘no’. This means doing one of the four things mentioned above, or as mentioned in the answer I accepted: disable the button HTML-element, thus suspending the response to event listeners.

Answer 1

I’d see two ways to do this:

1. Disable the element. When the element has the disabled state, event listeners are disabled on it.
2. Remove the event listener. That means you have to re-add it once you want to enable it again. Which means you may add your code to add the event in a function so that it is reusable.