html 富文本编辑器相关--主动选择文字-setSelectionRange 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        textarea{font-size:1em; width:500px; height:100px;}
    </style>
</head>
<body>
<textarea id="target"></textarea>
<p><button id="btn">插入话题</button></p>
</body>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
<script>
    var $ = function(id){
        return document.getElementById(id);
    };
    $("btn").onclick = function(){
        var con = "请在这里输入自定义话题";
        //转载文字
        $("target").innerHTML += "#"+con+"#";
        var l = $("target").innerHTML.length;
        //创建选择区域
        if($("target").createTextRange){//IE浏览器
            var range = $("target").createTextRange();
            range.moveEnd("character",-l)
            //range.moveStart("character",-l)
            range.moveEnd("character",l-1);
            range.moveStart("character", l-1-con.length);
            range.select();
        }else{
            $("target").setSelectionRange(l-1-con.length,l-1);
            $("target").focus();
        }
    };
</script>
</html>
View Code

 

posted @ 2017-04-14 10:09  _白马非马  阅读(231)  评论(0)    收藏  举报