jQuery 'input' event

Occurs when the text content of an element is changed through the user interface.

It's not quite an alias for keyup because keyup will fire even if the key does nothing (for example: pressing and then releasing the Control key will trigger a keyup event).

A good way to think about it is like this: it's an event that triggers whenever the input changes. This includes -- but is not limited to -- pressing keys which modify the input (so, for example, Ctrl by itself will not trigger the event, but Ctrl-V to paste some text will), selecting an auto-completion option, Linux-style middle-click paste, drag-and-drop, and lots of other things.

See this page and the comments on this answer for more details.

oninput event is very useful to track input fields changes.

However it is not supported in IE version < 9. But older IE versions has its own proprietary event onpropertychange that does the same as oninput.

So you can use it this way:

$(':input').on('input propertychange');

To have a full crossbrowser support.

Since the propertychange can be triggered for ANY property change, for example, the disabled property is changed, then you want to do include this:

$(':input').on('propertychange input', function (e) {    var valueChanged = false;    if (e.type=='propertychange') {        valueChanged = e.originalEvent.propertyName=='value';    } else {        valueChanged = true;    }    if (valueChanged) {        /* Code goes here */    }});

Using jQuery, the following are identical in effect:

$('a').click(function(){ doSomething(); });$('a').on('click', function(){ doSomething(); });

With the input event, however, only the second pattern seems to work in the browsers I've tested.

Thus, you'd expect this to work, but it DOES NOT (at least currently):

$(':text').input(function(){ doSomething(); });

Again, if you wanted to leverage event delegation (e.g. to set up the event on the #container before your input.text is added to the DOM), this should come to mind:

$('#container').on('input', ':text', function(){ doSomething(); });

Sadly, again, it DOES NOT work currently!

Only this pattern works:

$(':text').on('input', function(){ doSomething(); });

EDITED WITH MORE CURRENT INFORMATION

I can certainly confirm that this pattern:

$('#container').on('input', ':text', function(){ doSomething(); });

NOW WORKS also, in all 'standard' browsers.