Mengaktifkan Karakter Tab di dalam Textarea dengan Menekan Tombol

Saat kita mengetik tulisan di dalam <textarea>, kita tidak bisa menekan tombol tab untuk menyisipkan karakter tab karena saat kita melakukan itu, fokus kursor akan berpindah ke item formulir lain begitu saja. JavaScript ini bisa digunakan untuk menonaktifkan perpindahan formulir instan menggunakan tombol tab dan akan mengizinkan pengguna untuk menyisipkan karakter tab di dalam <textarea> dengan sekali tekan tombol tab:

function enableTab(id) {
    var el = document.getElementById(id);
    el.onkeydown = function(e) {
        if (e.keyCode === 9) { // tab was pressed

            // get caret position/selection
            var val = this.value,
                start = this.selectionStart,
                end = this.selectionEnd;

            // set textarea value to: text before caret + tab + text after caret
            this.value = val.substring(0, start) + '\t' + val.substring(end);

            // put caret at right position again
            this.selectionStart = this.selectionEnd = start + 1;

            // prevent the focus lose
            return false;

        }
    };
}

Penggunaan

enableTab('id-textarea');

Demo