将突出显示的文本保存到字符串

时间:2013-04-13 17:02:32

标签: javascript html web-applications highlight

我正在创建一个Web应用程序,将屏幕分成两个窗口,一面是基于Web的文本编辑器,另一面是普通窗口。 我试图找到一种方法,让用户可以在浏览器端突出显示某些文本,然后将突出显示的文本自动保存到字符串中,然后我就可以操作该字符串了。

有人有什么想法吗?任何帮助将不胜感激。

2 个答案:

答案 0 :(得分:4)

        function getSelectionText() {
            var text = "";
            if (window.getSelection) {
                text = window.getSelection().toString();
            } else if (document.selection && document.selection.type != "Control") {
                text = document.selection.createRange().text;
            }
            return text;
        }
        $(document).ready(function (){
           $('div').mouseup(function (e){
               alert(getSelectionText())
           })
        });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
        Hello, this is a highlight text test
    </div>

答案 1 :(得分:2)

所以你在这里有两个步骤。

  1. 捕获mouseup事件。
  2. 返回所选文字。
  3. 可以通过js调用访问文档中选择的任何文本:

    window.getSelection()
    

    但这是特定于浏览器的。因此,您可以使用此代码段来覆盖从所有浏览器中获取所选文本。

    function getSelectedText () {
        var txt = ''
        if (window.getSelection) {
            txt = window.getSelection();
        } else if (document.getSelection) {
            txt = document.getSelection();
        } else if (document.selection) {
            txt = document.selection.createRange().text;
        }
        return txt;
    }
    

    我假设你正在使用像jQuery这样的库。这样可以帮助处理mouseup事件。您可能不希望捕获整个文档的选择。所以你可以绑定到你需要的任何元素。像我这里的jsfiddle:http://jsfiddle.net/xh799/