Establecer la posición del cursor del teclado en el cuadro de texto html

Extraído de Configuración del cursor del teclado de Josh Stodola Posición en un cuadro de texto o área de texto con Javascript

Una función genérica que te permitirá insertar el cursor en cualquier posición de un cuadro de texto o área de texto que desees:

function setCaretPosition(elemId, caretPos) {
    var elem = document.getElementById(elemId);

    if(elem != null) {
        if(elem.createTextRange) {
            var range = elem.createTextRange();
            range.move('character', caretPos);
            range.select();
        }
        else {
            if(elem.selectionStart) {
                elem.focus();
                elem.setSelectionRange(caretPos, caretPos);
            }
            else
                elem.focus();
        }
    }
}

El primer parámetro esperado es el ID del elemento en el que desea insertar el cursor del teclado. Si no se puede encontrar el elemento, no pasará nada (obviamente). El segundo parámetro es el índice de posición del cursor. Zero pondrá el cursor del teclado al principio. Si pasa un número mayor que el número de caracteres en el valor del elemento, se colocará el cursor del teclado al final.

Probado en IE6 y versiones posteriores, Firefox 2, Opera 8, Netscape 9, SeaMonkey y Safari. Desafortunadamente, en Safari no funciona en combinación con el evento onfocus).

Un ejemplo del uso de la función anterior para forzar que el cursor del teclado salte al final de todas las áreas de texto de la página cuando reciben el foco:

function addLoadEvent(func) {
    if(typeof window.onload != 'function') {
        window.onload = func;
    }
    else {
        if(func) {
            var oldLoad = window.onload;

            window.onload = function() {
                if(oldLoad)
                        oldLoad();

                func();
            }
        }
    }
}

// The setCaretPosition function belongs right here!

function setTextAreasOnFocus() {
/***
 * This function will force the keyboard caret to be positioned
 * at the end of all textareas when they receive focus.
 */
    var textAreas = document.getElementsByTagName('textarea');

    for(var i = 0; i < textAreas.length; i++) {
        textAreas[i].onfocus = function() {
            setCaretPosition(this.id, this.value.length);
        }
    }

    textAreas = null;
}

addLoadEvent(setTextAreasOnFocus);

Feb 04 '2009 17:02 Ta01