I am trying to automatically jump to the second line after a certain number of characters. I am using the keypress function in jquery to do so. Here is my code:
<html>
<head>
<script type="text/javascript" src="http://inet.website-name.com/jquery/jquery-1.7.min.js"></script>
</head>
<body>
<input id="input1"></input>
<br />
<input id="input2"></input>
<script type="text/javascript">
$('#input1').keypress(function (e) {
var tval = $('#input1').val();
if (tval.length >= 5 && e.which !== 0 && e.charCode !== 0) {
$('#input2').focus();
}
})
</script>
</body>
</html>
The problem I am encountering is when this is run in chrome the 6th character is typed in the first box followed by the focus changing to the second box. When this is run in Internet Explorer, the focus is first changed to the second box and then the 6th character is typed. I need it to have the same behavior in both browsers.
I tried using the keydown event and that worked in terms of changing the focus consistently but the focus would change even if I used the backspace, arrow keys or any other special key.
Thanks in advance.
You could switch it to a keyup event and it will work, though you will not be able to use the e.charCode check (is it there for a reason?). Also note that the >= 5 was changed to a > 5
Fiddle