Effects of Key Events

Add a character in a <div contenteditable>
Browser keydown keypress propertychange DOMCharacterDataModified input keyup
Chrome 26 1 2 3 4 5
Firefox 20 1 2 3 4 5
Internet Explorer 8 1 2 3
Internet Explorer 9 1 2 3 4
Internet Explorer 10 1 2 3 4
Opera 12.14 1 2 3
Safari 6.0.2 1 2 4 3 5

Internet Explorer 8-10 and Opera 12.14 do not fire the input event for contenteditables.

DOMCharacterDataModified can be used to polyfill input in Internet Explorer 9-10.

Safari 6.0.2 fires input before DOMCharacterDataModified.

Not all modern browsers behave reliably, Opera 12.14 being the outlier.
Backspace a character in a <div contenteditable>
Browser keydown keypress propertychange DOMCharacterDataModified input keyup
Chrome 26 1 2 3 4
Firefox 20 1 2 3 4 5
Internet Explorer 8 1 2
Internet Explorer 9 1 2 3
Internet Explorer 10 1 2 3
Opera 12.14 1 2
Safari 6.0.2 1 3 2 4

Firefox 20 fires keypress whether adding and removing characters.

Internet Explorer 8-10 and Opera 12.14 do not fire the input event for contenteditables.

DOMCharacterDataModified can step in for input in Internet Explorer 9-10.

Safari 6.0.2 fires input before DOMCharacterDataModified.

Not all modern browsers behave reliably, Opera 12.14 being the outlier.
Add a character in an <input> or <textarea>
Browser keydown keypress propertychange DOMCharacterDataModified input keyup
Chrome 26 1 2 3 4
Firefox 20 1 2 3 4
Internet Explorer 8 1 2 3 4
Internet Explorer 9 1 2 3 4
Internet Explorer 10 1 2 3 4
Opera 12.14 1 2 3 4
Safari 6.0.2 1 2 3 4

All modern browsers behave consistently.

propertychange can step in for input in Internet Explorer 8.
Backspace a character in an <input> or <textarea>
Browser keydown keypress propertychange DOMCharacterDataModified input keyup
Chrome 26 1 2 3
Firefox 20 1 2 3 4
Internet Explorer 8 1 2 3
Internet Explorer 9 1 2
Internet Explorer 10 1 2 3
Opera 12.14 1 2 3
Safari 6.0.2 1 2 3

Firefox 20 fires keypress whether adding and removing characters.

propertychange can step in for input in Internet Explorer 8, while Internet Explorer 9 is worse off.

Not all modern browsers behave reliably, Internet Explorer 9 being the outlier.

Additional Notes

Different browsers fail at different times, with Internet Explorer 9 breaking for <input> and Opera 12.14 breaking for <div contenteditable>

Firefox 20 is the most consistent browser, supporting the widest range of events, whether adding or removing characters.

keydown and keyup are the only reliable cross-browser events.

Sources of influence

onInput event detection support

A HTML5 Browser maze, oninput support

Fixing oninput in IE Using html5Widgets

Last updated: April 18, 2013