码海拾遗--利用JavaScript获取用户选定的内容

最近接触了一些Web开发技术,现归纳一下所学到的知识,将其整理到博客上。如有疏漏及不正确的观点,还请多多指教。

背景:

有些情况下,我们需要获取到用户在页面上选定的文本内容,比如在线的HTML编辑器,用户在更改文本字体时会先选中文本然后点击更改字体选项,此时就需要获取用户的选中信息来实现这个功能。

实现方法

利用selection对象来获取表示当前网页中的选中内容。

实例解析

我们用一个简单的例子来说明,该例子获取用户选定的文本并用alert输出,下面给出核心JS代码。
<script>
function GetSelection () {

    if (document.selection) {
        text=document.selection.createRange().text; 
//createRange()根据文字选择返回TextRange对象,根据控件选择返回ControlRange 对象,通过利用返回对象的方法,可以实现更多功能,本次仅获取选中文本。

    } else{
        text=document.getSelection();
    }
    return text.toString();
}
$("#testArea").onmouseup(function(){ 
    var txt = "";
    txt = GetSelection();
    alert(txt);

})
</script>

注意:document.selection仅被IE所支持。

猜你喜欢

转载自blog.csdn.net/lawfay/article/details/43604627