javascript - How to get the text of a selection over multiple HTML elements? - Stack Overflow

admin管理员组

文章数量:1022525

Here is my question:

When the user makes a selection in an article or in the editing area of a WYSWYG editor widget, the selection can span over multiple elements, like anchors, images, span tags... even block-level elements (but no table in my problem).

I know how to retrieve a Range object from the selection, but could not find a reliable solution to get the content text of the Range object.

I'm not looking for a solution for IE (its TextRange object has a .text property).

Thanks!

Here is my question:

When the user makes a selection in an article or in the editing area of a WYSWYG editor widget, the selection can span over multiple elements, like anchors, images, span tags... even block-level elements (but no table in my problem).

I know how to retrieve a Range object from the selection, but could not find a reliable solution to get the content text of the Range object.

I'm not looking for a solution for IE (its TextRange object has a .text property).

Thanks!

• javascript
• html
• selection

Share Improve this question Follow edited Jun 24, 2011 at 18:05 Luc125 asked Jun 24, 2011 at 18:00 Luc125Luc125 5,8673535 silver badges3535 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

Have you looked at the quirksmode article on Range?

Based on this article, you could create a method like this:

function getRangeText() {

    var userSelection;
    if (window.getSelection) {
        userSelection = window.getSelection();
    } else if (document.selection) {
        userSelection = document.selection.createRange();
    }
    var selectedText = userSelection;
    if (userSelection.text) {
        selectedText = userSelection.text;
    }
    return selectedText;
}

I tested this in FF5, Opera 11, Safari on the Mac, as well as IE6 and IE7. It's worth testing in the other IE browsers, but my guess is it works in them, as well.

This returns a string and works in all major browsers:

function getSelectionText() {
    var text = ""
    if (window.getSelection) {
        text = window.getSelection().toString();
    } else if (document.selection && document.selection.type == "Text") {
        text = document.selection.createRange().text;
    }
    return text;
}

Here is my question:

When the user makes a selection in an article or in the editing area of a WYSWYG editor widget, the selection can span over multiple elements, like anchors, images, span tags... even block-level elements (but no table in my problem).

I know how to retrieve a Range object from the selection, but could not find a reliable solution to get the content text of the Range object.

I'm not looking for a solution for IE (its TextRange object has a .text property).

Thanks!

Here is my question:

When the user makes a selection in an article or in the editing area of a WYSWYG editor widget, the selection can span over multiple elements, like anchors, images, span tags... even block-level elements (but no table in my problem).

I know how to retrieve a Range object from the selection, but could not find a reliable solution to get the content text of the Range object.

I'm not looking for a solution for IE (its TextRange object has a .text property).

Thanks!

• javascript
• html
• selection

Share Improve this question Follow edited Jun 24, 2011 at 18:05 Luc125 asked Jun 24, 2011 at 18:00 Luc125Luc125 5,8673535 silver badges3535 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

Have you looked at the quirksmode article on Range?

Based on this article, you could create a method like this:

function getRangeText() {

    var userSelection;
    if (window.getSelection) {
        userSelection = window.getSelection();
    } else if (document.selection) {
        userSelection = document.selection.createRange();
    }
    var selectedText = userSelection;
    if (userSelection.text) {
        selectedText = userSelection.text;
    }
    return selectedText;
}

I tested this in FF5, Opera 11, Safari on the Mac, as well as IE6 and IE7. It's worth testing in the other IE browsers, but my guess is it works in them, as well.

This returns a string and works in all major browsers:

function getSelectionText() {
    var text = ""
    if (window.getSelection) {
        text = window.getSelection().toString();
    } else if (document.selection && document.selection.type == "Text") {
        text = document.selection.createRange().text;
    }
    return text;
}

本文标签： javascriptHow to get the text of a selection over multiple HTML elementsStack Overflow