The only way I could figure around this on Netscape 7.1/Mozilla is to
get the range, delete it, create a new node, insert new node contents,
then use a regular expression search and replace to modify the
innerHTML content.
The is a bit of a quick-fix hack, and major drawback to this is that
getSelection only returns text, not the HTML, so assume I have lots of
line breaks or paragraph breaks within the HTML source, these vanish
when I insert the new node contents.
I seriously can't think of a better way around this....
var re = /(<span)([^&]+)(>)([^&]+)(<\/span>)/img;
var re1 = /(<span[^>]+><\/span>)/img;
var selection = window.getSelection();
var copytext = selection.toString();
var newHTML = "<span style='//your style//'</span>";
rng = selection.getRangeAt(0);
selection.deleteFromDocument();
newRng = selection.getRangeAt(0);
replaceText = document.createTextNode(newHTML);
newRng.insertNode(replaceText)
var rp = window.document.body.innerHTML;
rp = rp.replace(re, "<span$2>$4</span>");
rp = rp.replace(re1, ""); // remove multiple redundant tags
window.document.body.innerHTML = rp;
Neil.
neil@sentinel.f9.co.uk (sentinel) wrote in message news:<f1e13721.0406240400.3f570060@posting.google. com>...[color=blue]
> I guess I'm going to have to do a little experimentation...
>
> I need to construct something that will work on an OS X browser as well as IE5+.
>
> Martin Honnen <mahotrash@yahoo.de> wrote in message news:<40d9a009@olaf.komtel.net>...[color=green]
> > sentinel wrote:
> >[color=darkred]
> > > Do you know of a solution that will work on Netscape 7.1 ?[/color]
> >
> > Netscape doesn't implement the document.selection object that IE has,
> > nor the TextRange that IE has.
> > It has a buggy implementation of the W3C DOM Level 2 Range specification
> > documented at
> >
http://www.w3.org/TR/DOM-Level-2-Tra...ge/ranges.html
> > which is connected to its selection object returned by
> > window.getSelection()
> > whose interface is documented at
> >
http://lxr.mozilla.org/seamonkey/sou...ISelection.idl
> > Theoretically you should be able to use a method like surroundContents:
> >
http://www.w3.org/TR/DOM-Level-2-Tra...ge-Surrounding
> > to wrap some range content into a span element for instance but last
> > time I have tried that with Netscape 7 it failed due to bugs.
> >
> > When I try the following with Mozilla 1.7 or FireFox 0.9
> >
> > <html lang="en">
> > <head>
> > <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
> > <title>does surroundContents work?</title>
> > <script type="text/javascript">
> > function wrapSelection (cssClassName) {
> > if (typeof window.getSelection != 'undefined') {
> > var selection = window.getSelection();
> > if (typeof selection.rangeCount != 'undefined' &&
> > selection.rangeCount > 0) {
> > var range = selection.getRangeAt(0);
> > if (typeof range.surroundContents != 'undefined') {
> > var span = document.createElement('span');
> > span.className = cssClassName;
> > range.surroundContents(span);
> > }
> > }
> > }
> > }
> > </script>
> > <style type="text/javascript">
> > .selectionHighlight {
> > background-color: lightyellow;
> > }
> > </style>
> > </head>
> > <body>
> > <p>
> > Select some text in this paragraph with the mouse.
> > Then press the highlight button.
> > All for Kibology. Kibology for all.
> > </p>
> > <form action="" onsubmit="return false;">
> > <p>
> > <input type="button" value="highlight selection"
> > onclick="wrapSelection('selectionHighlight');">
> > </p>
> > </form>
> > </body>
> > </html>
> >
> > I still get an error on the surroundContents call:
> >
> > Error: uncaught exception: [Exception... "Index or size is negative or
> > greater than the allowed amount" code: "1" nsresult: "0x80530001
> > (NS_ERROR_DOM_INDEX_SIZE_ERR)" location:
> > "http://localhost/javascript/test20040623.html Line: 15"]
> >
> > which I think is caused by the buggy Mozilla implementation of
> > Range/surroundContents.[/color][/color]
