javascript text input change event not firing

I have a text type input field a开发者_StackOverflow社区nd a checkbox. If I change the text and then click outside the input box (or press enter or tab) the change event is thrown. But if I enter some text and then click directly on the checkbox using the mouse, only the checkbox change event seems to be thrown.

I have the following code:

<input type="text" name="text" class="update">
<input type="checkbox" name="check" class="update">

and this jQuery:

$('.update').change(function(){
    console.log($(this));
});

Is this a known problem, and how can I make sure all change events are fired/thrown/caught in this setup?

To fire user changes, use the input event:

$('input').on('input',function(){...})

To fire code changes, use the DOMSubtreeModified event:

$('input').bind('DOMSubtreeModified',function(){...})

If you want to fire both user and code changes:

$('input').bind('input DOMSubtreeModified',function(){...})

The DOMSubtreeModified event is marked as deprecated and sometimes quite CPU time consuming, but it may be also very efficient when used carefully...

I'm not sure if I get it. But for me when I try to type in textfield and then click checkbox by mouse both events are fired. But you have to keep in mind that event 'change' for text input means that this input has to loose focus, as long as field is focused no change event ever will be triggered. This somehow might be your case. Checkboxes/radioboxes work different way tho. No need to loose focus.

Cheers.

P.S. My test case: http://dl.dropbox.com/u/196245/index16.html

The change event fires for both because you're listening to the update class.

The change event will not fire unless the input focus switched to other controls