DEV Community

Techsolutionstuff
Techsolutionstuff

Posted on • Originally published at techsolutionstuff.com

Autotab To Next Input Field JQuery Example

n this example I will give you example of autotab to next input field jquery or move cursor to next input jquery when maxlength is reached, some time we have requirement to restrict user to add more character than set limit at that we can use autotab to next input field javascript.

Here, I will give you jquery autotab to next input field when fill 1 character jQuery or move cursor to next input jquery or javascript focus next input

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<style>
input { 
width: 25px; margin: 5px; height:25px;  
}
</style>

</head>
<body>

<input class="inputs" type="text" maxlength="1" />
<input class="inputs" type="text" maxlength="1" />
<input class="inputs" type="text" maxlength="1" />
<input class="inputs" type="text" maxlength="1" />
<input class="inputs" type="text" maxlength="1" />
<input class="inputs" type="text" maxlength="1" />
<script>
$(".inputs").keyup(function () {
    if (this.value.length == this.maxLength) {
      $(this).next('.inputs').focus();
    }
});
</script>
</body>
</html>
Enter fullscreen mode Exit fullscreen mode

You might also like :

Discussion (0)