如何用Javascript获取选择文本?

直接用例子说话：

<body>
<div id="TextEara">
     <p>这是一条测试字符串</p>
</div>
</body>
用鼠标选择“测试”
1、得到“条测试字”，就是对原来的选择文本的范围向左右各扩展一个（多个）字符；
2、得到“测试”所在的索引号（位 置），这里返回4；
3、得到DOM路径，这里返回“<body><div><p>”

如果要 用JS库的话，希望能选用jQuery。
谢谢各位大 侠了！！

  • 怪蜀黍J大神 - 1年前 

    <body>
<div id="TextEara">
     <p>这是一条测试字符串就对原来的选择文本的范围向左右各扩展</p>
</div>
</body>

<script. type=text/javascript>
function $(o){
     return document.getElementById(o) || o
}
$("TextEara").onmouseup = function(){
     var x, y, n = 2, str = $("TextEara").innerHTML.replace(/<[^>]*>|[\n|\s]*/g,"");
     !! window.getSelection ? get(window.getSelection().toString()) : get(document.selection.createRange().text);
     function get(sel){
              var reg = new RegExp("^[^^]*(([^^]{"+n+"}|^.*)"+sel+"([^^]{"+n+"}|.*$))[^^]*$", "g");
              alert(str.replace(reg, "$1"));  //第一问，如果选择扩展超出边界有多少个扩多少个
              alert(str.indexOf(sel));        //第二问
     }
} 
</script>

  • neptune - 1年前 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta. http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script. type="text/javascript">
    var rg = {};
    rg.getText = function(id, lmove, rmove) {
        var o = document.getElementById(id).getElementsByTagName('p')[0];
        if(window.getSelection) {
            var range =  window.getSelection().getRangeAt(0), start = range.startOffset,
            end = range.endOffset, html = o.innerHTML.substring(start - lmove, end + rmove);    
            return  '索引位置: ' + start + ' 扩展后字符: ' + html;
        } else {
            var range = document.selection.createRange(), txt = range.text;
            range.moveStart('character', -lmove);
            range.moveEnd('character', rmove);
            return  '索引位置: ' + o.innerHTML.search(new RegExp(txt)) + '扩展后字符: ' + range.text;
        }
    };

    rg.getPath = function() {
        var tbl = [];
        var direct = (document.selection && document.selection.createRange)
                        ? document.selection.createRange().parentElement()
                        : window.getSelection().focusNode.parentNode;
        do {
            tbl.push(direct.tagName);
        }
        while ((direct = direct.parentNode) && (direct != document.documentElement))
        return tbl.reverse().join('---->');
    };

</script>
</head>
<body>
<div id="TextEara">
    <p>这是一条测试字符串</p>
</div>
<input type="button" value="getText" nclick="alert(rg.getText('TextEara', 1, 1));" />
<input type="button" value="getPath" nclick="alert(rg.getPath());" />
</body>
</html>