Pour tester les fonctions de la touche TAB, essayez de changer la sélection des lignes avant de taper la touche TAB.

Par exemple, vous pouvez sélectionner plusieurs lignes, puis tapez la touche TAB, cela fait augmenter les retraits de chaque ligne par quatre espace. Inversement, pour diminuer les retraits des lignes, utilisez la touche combinée Shift + TAB.

<script langage="javascript">
var gsTab = "    "; // select tab char : tab or spaces
var gsReturn = "\n";
    
function insertTab(e) {
    var key = e.keyCode ? e.keyCode : e.charCode ? e.charCode : e.which;

    if (key == 9 && !e.ctrlKey && !e.altKey) {
        var isFF = !(e.preventDefault == undefined); // verify if or not firefox
        var o = ((isFF) ? e.target : e.srcElement);
        var iTop = o.scrollTop; // for anti-scroll in firefox
        if (!e.shiftKey ) {
            (isFF) ? setIndentFF(o,e,true) : setIndentIE(o,e,true) ;
        } else {
            (isFF) ? setIndentFF(o,e,false) : setIndentIE(o,e,false) ;
        }
        e.returnValue = false;
        if (isFF) { e.preventDefault();}
        o.focus();
        o.scrollTop = iTop;
        return false;
    }
    return true;
}
function setIndentFF(o,e,bAdd) {
    var sFull = o.value, sSel = '', sNew = '', iStart, iEnd;
    iStart = o.selectionStart;
    iEnd = o.selectionEnd;
    sSel = sFull.substring(iStart, iEnd);
    if (sSel.length) { 
        iStart = sFull.lastIndexOf(gsReturn, iStart) + 1;
        sSel = sFull.substring(iStart, iEnd);
        sNew = bAdd ? getTabAddedStr(sSel) : getTabDeletedStr(sSel); 
        o.value = sFull.substring(0, iStart) + sNew + sFull.substring(iEnd);
        o.setSelectionRange(iStart, iStart + sNew.length);
    } else if (bAdd) {
        o.value = sFull.substring(0, iStart) + gsTab + sFull.substring(iEnd);
        o.setSelectionRange(iStart + gsTab.length, iStart + gsTab.length);
    }
}
function setIndentIE(o,e,bAdd) {
    var rng, sFull, sSel, iStart, iEnd, sNew, iStartRes;
    rng = document.selection.createRange();
    sFull = o.value;
    sSel = rng.text;
    if (sSel.length) { 
        iStartRes = getSelStartIE(o); // sel start first point
        iStart = sFull.lastIndexOf(gsReturn,iStartRes)+1; // new sel start point
        rng.moveStart("character",iStart - iStartRes);
        rng.moveEnd("character",-1); // tric pour IE
        rng.select();
        sSel = rng.text;
        sNew = bAdd ? getTabAddedStr(sSel) : getTabDeletedStr(sSel); 
        rng.text = sNew;
        rng.collapse(false);
        rng.moveStart("character", -sNew.length + sNew.split(gsReturn).length -1);
        rng.moveEnd("character",1); // tric pour IE
        rng.select();
    } else if (bAdd) {
        rng.text = gsTab;
        rng.select();
    }
}
function getTabDeletedStr(sTmp) {
    var aSel = sTmp.split(gsReturn);
    // tab = 4 spaces
    var aRex = Array(/^\t/,/^ {4}/,/^ {1,3}\t*/);
    for (var i=0, sLine; i<aSel.length; i++) {
        sLine = aSel[i];
        for (var j=0; j<3; j++) {
            if (sLine.match(aRex[j])) {
                aSel[i] = sLine.replace(aRex[j],'');
                break;
            }
        }
    }
    return aSel.join(gsReturn);
}
function getTabAddedStr(sTmp) {
    aSel = sTmp.split(gsReturn);
    for (var i=0; i<aSel.length; i++) {
        aSel[i] = gsTab + aSel[i];
    }
    return aSel.join(gsReturn); 
}
function getSelStartIE(textarea) {
    var r = document.selection.createRange ();
    var lensel = r.text.length;
    // Move selection start to 0 position.
    r.moveStart ('character', -textarea.value.length);
    // The caret position is selection length
    return r.text.length-lensel;
}
</script>

<!-- ajoutez sur la page un TEXTAREA ayant un attribut "onkeydown" 
comme le suivant:

<textarea id='txt' onkeydown="javascript:insertTab(event)" >
</textarea>

-->