让textarea光标定位到最后

网上很多代码都是关于IE的,使用createTextRange来定位,具体的类似代码是

var obj = document.getElementById("textareaId"); 
var txt =obj.createTextRange(); 
txt.moveStart('character',obj.value.length); 
txt.collapse(true); 
txt.select();
代码网上很多,但是很多都没有明确标识出这个方法只适用于IE浏览器,在chrome和foxfire中是没有效果的,而且会直接跳出。

由于他们都没有明确的表示,让我走了一些弯路,明明很简单的事情。

在chrome和foxfire中都支持selectionStartselectionEnd

只要把selectionStart定位到内容的长度就会把光标指向最后。

var obj = document.getElementById("textareaId");
obj.selectionStart = obj.value.length;

但是如果超过原本长度出现了滚动条,那就要先把滚动条滚动到最后——scrollTop

scrollTop可以设置滚筒条的位置,通过

obj.scrollTop = obj.scrollHeight;

就可以把滚动条滚动到编辑区域的最后,测试下IE、chrome和foxfire都支持。

所以完整的方法应该是:

function goEnd(){    
    var isIE = CheckIE();  //判断是否是IE浏览器,方法略
    var obj = document.getElementById("txt");
    obj.scrollTop = obj.scrollHeight;
    if(isIE){
        var txt =obj.createTextRange(); 
        txt.moveStart('character',obj.value.length); 
        txt.collapse(true); 
        txt.select(); 
    }else{
        obj.selectionStart = obj.value.length;
    }
}





原文地址:https://www.cnblogs.com/mnight/p/3055084.html