Enter As TAB //JavaScript Repository


Tabulation through the enter key.
Created: 2005.08.08 - Modified 2013.09.17


Code (Download)

//+ Jonas Raoni Soares Silva
//@ http://jsfromhell.com/forms/enter-as-tab [rev. #3]

enterAsTab = function(f, a){
    addEvent(f, "keypress", function(e){
        var l, i, f, j, o = e.target;
        if(e.key == 13 && (a || !/textarea|select/i.test(o.type))){
            for(i = l = (f = o.form.elements).length; f[--i] != o;);
            for(j = i; (j = (j + 1) % l) != i && (!f[j].type || f[j].disabled || f[j].readOnly || f[j].type.toLowerCase() == "hidden"););
            e.preventDefault(), j != i && f[j].focus();

Example (Example)

<form action="" id="form">
    <legend>Tabula??o via enter</legend>
    <label>input text</label><input type="text" />
    <label>input text</label><input type="text" />
    <label>input text</label><input disabled="disabled" type="text" />
    <label>input radio</label><input type="radio" name="aaa" /> op??o 1
    <input type="radio" name="aaa" checked="checked" /> op??o 2
    <label>textarea</label><textarea rows="3" cols="15">aaaaaa pode dar enter q ele naum pula hahah</textarea>
    <label>textarea</label><select><option>op??o blablablabla</option><option>op??o bleblebleble</option></select>
    <label>input text</label><input type="text" />

<script type="text/javascript">




enterAsTab(form: HTMLFormElement, [jumpAlways: Boolean = false]): void
The function will add the tabulation through the enter key for all the inputs, except <select>'s (enter is used to select an option) and <textarea>'s (enter is used to break lines). When the last element is reached the default behaviour is to get back to the first element.
formulary that will receive the tabulation via enter
if true, the enter will jump even selects and textareas

Rank (Votes: 160)