These days listen for oninput
. It feels like onchange
without the need to lose focus on the element. It is HTML5.
It’s supported by everyone (even mobile), except IE8 and below. For IE add onpropertychange
. I use it like this:
const source = document.getElementById('source');
const result = document.getElementById('result');
const inputHandler = function(e) {
result.innerHTML = e.target.value;
}
source.addEventListener('input', inputHandler);
source.addEventListener('propertychange', inputHandler); // for IE8
// Firefox/Edge18-/IE9+ don’t fire on <select><option>
// source.addEventListener('change', inputHandler);
<input id="source">
<div id="result"></div>