jquery - can't select text after making input only numeric -

this problem seems happen in webkit based browsers (chrome , safari). not firefox.

after constraining input fields numerics , : i'm no longer able select text or move cursor left arrow keys. input gets deselected or in case of cursor: it's moved end of input. (i able place cursor somewhere in string clicking there mouse)

code used:

$('#from, #to, #rate, #break').keyup(function () {      this.value = this.value.replace(/[^0-9:\.]/g,''); }); 

example in fiddle: http://jsfiddle.net/paulvddool/ekybr/

did wrong? negative side effect can't about? or there way make textselection , cursor movement possible?

when overwrite value, caret automatically goes end of input.

what need overwrite value, if needed. i.e. like:

$('#from, #to, #rate, #break').keyup(function () {      switch(e.which) {         case 37:         case 38:              case 39:         case 40: break;         default: this.value = this.value.replace(/[^0-9:\.]/g,'');     } }); 

demo