By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
440,211 Members | 2,227 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 440,211 IT Pros & Developers. It's quick & easy.

Getting the coordinates of a piece of text with Javascript?

P: n/a
Hi,

I would like to find the coordinates of a word inside a div or span
tag. I know you can find the coordinates of a tag inside the DOM, but
can you get the coordinates of a portion of the text inside that
element in javascript?
If the user highlights or selects text in a div or span can I get the
indicies that make up that selected piece of text? What API of
javascript do I use to find that out? Or really is there a way in
javascript to interact with the browsers text selection?
Thanks
Charlie

Feb 22 '06 #1
Share this Question
Share on Google+
2 Replies


P: n/a


sasperilla wrote:
If the user highlights or selects text in a div or span can I get the
indicies that make up that selected piece of text? What API of
javascript do I use to find that out? Or really is there a way in
javascript to interact with the browsers text selection?


Browser specific, IE/Win has
document.selection
has an object with a method createRange
var range = document.selection.createRange()
where that range has lots of properties and methods to inspect and
manipulate it:
<http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/objects/obj_selection.asp>
<http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/objects/obj_textrange.asp>

Mozilla gives you its (very different) selection object with
window.getSelection()
and that can be manipulated, partly with proprietary Mozilla stuff,
partly based on the W3C DOM Level 2 Range API (selection consists of one
or more such ranges)
<http://xulplanet.com/references/objref/Selection.html>
<http://www.w3.org/TR/DOM-Level-2-Traversal-Range/ranges.html>
Opera 9 preview also supports
window.getSelection()
and seems to follow the Mozilla implementation though I am not sure how
complete that is currently and how complete it is intended to become.
But if text is selected somewhere in the HTML document then e.g.
window.getSelection().getRangeAt(0).deleteContents ()
does remove the selected contents.
As for selection specific events, IE has lots of them, see
<http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/events/onselectstart.asp>
for instance.

Mozilla gives you two properties on the event object
rangeParent
rangeOffset
that relate to the range(s) used with the selection object.

--

Martin Honnen
http://JavaScript.FAQTs.com/
Feb 22 '06 #2

P: n/a
Does Safari have support for selection? Since this is browser specific
I might not be able to support certain browsers if I chose to use these
APIs. Cross browser support is important to me.

The only other option I can think is the use the mouse listeners (ala
drag and drop) and map those mouse clicks on to particular texts
portions and implement my own text selection. I'm not wild about that
since things like copy/paste etc wouldn't work.

Thanks
Charlie

Feb 22 '06 #3

This discussion thread is closed

Replies have been disabled for this discussion.