2012-04-14 49 views
5

¿Hay alguna manera de colocar el cursor al final en una etiqueta TEXTAREA? Estoy usando Firefox 3.6 y no lo necesito para trabajar en IE o Chrome. JavaScript está bien pero parece que todas las respuestas relacionadas aquí usan el evento onfocus(), que parece ser inútil porque cuando el usuario hace clic en cualquier lugar dentro de textarea, Firefox establece la posición del cursor allí. Tengo un texto largo para mostrar en un área de texto para que muestre la última parte (lo que facilita añadir algo al final).¿Cómo colocar el cursor al final en un TEXTAREA? (al no usar jQuery)

Respuesta

1
var t = /* get textbox element */ ; 

t.onfocus = function() { 
    t.scrollTop = t.scrollHeight; 
    setTimeout(function(){ 
     t.select(); 
     t.selectionStart = t.selectionEnd; 
    }, 10); 
} 

El truco es usar el setTimeout para cambiar la inserción de texto (quilates) Posición después de que el navegador se hace el manejo del evento de foco; de lo contrario, nuestro script establecería la posición y el navegador la establecería de inmediato en otra cosa.

5

Ha sido un largo tiempo desde que utiliza javascript sin antes mirar a una solución de jQuery ...

Dicho esto, el mejor enfoque usando javascript sería para agarrar el valor actualmente en el área de texto cuando se enfoca y establece el valor del área de texto al valor capturado. Esto siempre funciona en jQuery como:

$('textarea').focus(function() { 
    var theVal = $(this).val(); 
    $(this).val(theVal); 
}); 

en JavaScript claro:

var theArea = document.getElementByName('[textareaname]'); 

theArea.onFocus = function(){ 
    var theVal = theArea.value; 
    theArea.value = theVal; 
} 

podría estar equivocado. Un poco oxidado

+0

me gusta esta solución porque está a sólo 2 líneas de código, pero yo creo que es un trabajo más intensivo que la solución Starx . –

3

Aquí es una función para la que

function moveCaretToEnd(el) { 
    if (typeof el.selectionStart == "number") { 
     el.selectionStart = el.selectionEnd = el.value.length; 
    } else if (typeof el.createTextRange != "undefined") { 
     el.focus(); 
     var range = el.createTextRange(); 
     range.collapse(false); 
     range.select(); 
    } 
} 

[Demo][Source]

2
textarea.focus() 
textarea.value+=' ';//adds a space at the end, scrolls it into view 
1
(this.jQuery || this.Zepto).fn.focusEnd = function() { 
    return this.each(function() { 
     var val = this.value; 
     this.focus(); 
     this.value = ''; 
     this.value = val; 
    }); 
}; 
Cuestiones relacionadas