• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

15. Dynamic Content Applications > 15.2. Converting a User Selection into an Ar...

Converting a User Selection into an Arbitrary Element

NN n/a, IE 4(Win)

Problem

You want to wrap a user’s body text selection in an element to assign a style that highlights the selection.

Solution

We begin with a paragraph container that processes a selection by way of an onmouseup event handler:

<p onmouseup="selection2Element( )">Lorem ipsum dolor sit amet, consectetaur 
adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. </p>

The selection2Element( ) event handler function creates an IE TextRange object whose boundaries coincide with the current selection, as reported by the browser the instant the mouse button is released on the container:

function selection2Element( ) {
    var rng = document.selection.createRange( );
    var newHTML = "<span class='newSpan'>" + rng.text + "</span>";
    rng.pasteHTML(newHTML);
}

PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint