Я играю с некоторыми элементами HTML5 и столкнулся с забавным поведением. Это работает только в Chrome.
Используя тип ввода числа, вы можете установить мин, макс и шаг, а также стрелки вверх и вниз для управления вводом. <input type="number" min="0" max="100" step="5" />
Я обнаружил, что привязка слушателя события щелчка захватывает нажатия на стрелки, так как изменение фактически не произойдет, пока поле не будет размыто. Вы также можете использовать клавиши со стрелками вверх и вниз на клавиатуре, чтобы изменить значение в определенных пределах, и при нажатии клавиши их можно получить.
В Chrome, однако, вы также можете использовать колесико мыши, чтобы изменить ввод, наведя курсор на ввод и прокручивая его. Однако я не смог найти способ прослушать это событие.
Пример для jsfiddle
HTML:
<input type="number" min="0" max="100" step="5" id="test" />
JavaScript (с использованием jQuery):
$( '#test' ).click(function(){
$( this ).after( '<br />click' );
});
$( '#test' ).change(function(){
$( this ).after( '<br />change' );
});
$( '#test' ).keypress(function(){
$( this ).after( '<br />keypress' );
});
Есть какие-нибудь идеи о том, как выслушать это изменение свитка? Опять же, это работает только в Chrome на момент написания.