[SOLVED] How to achieve consistent blur behavior with IE10 and webshims number input?

How to achieve consistent blur behavior with IE10 and webshims number input?

This sample jsfiddle displays 3 number inputs, each with blur and focus events assigned:

<script>

  jQuery('.number')
    .on('focus', function (e) {
      jQuery(e.currentTarget).val(1);
    })
    .on('blur', function (e) {
      jQuery(e.currentTarget).val(0);
    });

</script>

<input type='number' class='number' id='n0' min='0' max='1' autofocus />
<input type='number' class='number' id='n1' min='0' max='1' />
<input type='number' class='number' id='n2' min='0' max='1' />

Normally, under Chrome for example, focus sets input values to 1 and blur sets input values to 0. With IE10 and webshims however, values appear to be set on every other blur.

Should the blur event be handled differently?

Solution

Well, you found a bug. Will fix this soon. As for now you can workaround this bug by using a setTimeout with a delay of 9.

http://jsfiddle.net/trixta/9y3HA/8/

setTimeout(function(){
    jQuery(e.currentTarget).val(0);
}, 9);