Wrox Home  
Search P2P Archive for: Go

  Return to Index  

javascript thread: Re: contentEditable in conjunction with TextRange


Message #1 by "Joshua Hatfield" <flobi@f...> on Tue, 9 Apr 2002 00:45:09
No, I don't have a freaking clue.  I've been surfing the web for a week 
trying to find anything even remotely similar.  I have found that you can 
use ctrl+b for bold (although it actually uses the strong tag), ctrl+i 
italicizes (em tag) and ctrl-u underlines (u tag).  I am assuming that you 
are building a program similar to the one I am building, and I think that 
this may be useful.

Using document.selection.createRange(), you can create a referrence to the 
current selection (which is the current caret position if there is no 
selection).  Examples of use:

To insert text at a given point (only if no text is selected):
document.selection.createRange().text = "text with which to insert" 

To replace the selected text:
document.selection.createRange().text = "text with which to replace" 

Unfortunately, clicking or right-clicking on the document (unless directly 
on the selection) causes the current selection to be lost and moved to 
where you clicked or right-clicked.  Haven't tested this, but I would 
assume that it is also lost if you double-click or drag.  Also, this only 
works in IE (which is okay for me, because the requirements of the program 
I am writing already requires IE, and I'm not changing that anyhow).

Apparently Netscape uses a document.getSelection, but I haven't looked 
into it.  

As for taking care of the click problem, I am personally solving it by 
creating a custom contextMenu and traping the selection like this

onContextMenu="CurrentSelection=document.selection.createRange();{...other 
commands to create menu}"

and when they click on whatever it is that inserts/updates/deletes the 
selection (which would normally move the selection to where they click, I 
use the CurrentSelection variable which seems to keep record of what was 
selected when it was assigned.

I hope I have explained well enough for this to be useful.  If you find 
out that I'm wrong, or misled in this, let me know.  Thanks

Flobi of Flobi.com

> Does anyone know of a way to get the cursor's current x and y position 
in a
> contentEditable area (e.g. a DIV)?
> My problem is to track the contentEditable area's cursor that shows where
> the insertion point is for the moment, 
> i.e. the blinking one symbolizing where one can insert text etc (NOT the
> mouse cursor)....
> 
> I need to move the TextRange to that point, but I can't find a way to get
> those values.
> Of course one can check the onKeyDown events etc, and then move the
> TextRange by checking boundingWidth etc etc,
> but still I can't find a way to be 100% sure where the cursor is.
> 
> 
> Please Help!
> 
> 
> /Robert Nyman

  Return to Index