javascript - onchange event not fire when the change come from another function

Question

I have a input text that get his value from a Javascript function (a timer with countdown).

I want to raise an event when the input text is 0 ,so i am using the change eventListener.

Unfortunately it doesn't seem to raise the event when the change is coming from javascript function.

How can I force the change event to work, even if the change is coming from Javascript and not from the user?

Answer 1

From the fine manual:

change
The change event occurs when a control loses the input focus and its value has been modified since gaining focus. This event is valid for INPUT, SELECT, and TEXTAREA. element.

When you modify the text input's value through code, the change event will not be fired because there is no focus change. You can trigger the event yourself though with createEvent and dispatchEvent, for example:

el = document.getElementById('x');
ev = document.createEvent('Event');
ev.initEvent('change', true, false);
el.dispatchEvent(ev);

And a live version: http://jsfiddle.net/ambiguous/nH8CH/