For FF: window.getSelection().removeAllRanges(); range = document.createRange() range.setStart(YOUR_ELEMENT, start_position); range.setEnd(YOUR_ELEMENT, end_position); //0 window.getSelection().addRange(range);
For IE the equivalent is something like: get the range with document.body.createTextRange() call moveToElementText, call setEndPoint, call moveStart, call moveEnd, then select(). It's been a while since I've had to work with any of this (and fortunately I wasn't having to code for IE at the time). Getting your start position is part of the problem if the caret was in a bunch of nested elements. One thing that might help is to pass window.getSelection() to the Firebug console and then you can expand the object to see all of the available methods (which won't necessarily be the same in IE :( ). I'm afraid jQuery won't be of help here. A good source for information on the Range and Selection objects is MDC: https://developer.mozilla.org/En/DOM:Range Unfortunately, cross-browser implementations of the Range object are inconsistent and the documentation minimal. HTH :) On Jun 5, 1:34 pm, dhoover <dh.ferm...@gmail.com> wrote: > I have a web app where I have created a div to masquerade at a > textarea so I can add highlighting according to so rules. I rely on > setting designmode=true. After certain amounts of idle time my code > grabs the text from the div, which consists of <p> tags and <span> > tags and re-generates the html with new spans. The paragraphs and text > stay the same. So far so good. But when the div "repaints" the > insertion is set to the beginning of the div. I want it to visually > stay put, meaning I need to somehow record where it was before and > then restore it afterwards. > > Problem is, I can't seem to get my head wrapped around how selections > (Ranges, etc.) work. I've been googling around for the last day or so > and have not yet seen the light. > > Any ideas?
