Question

Does anyone know if it is possible with javascript to to tell the position of a mouse click in some text? I know it’s easy to get the x,y coordinates, but I’m wanting the position in the text.

For example if I clicked inside <p>foo bar</p>
I want to be able to tell that the click was on/after the 5th character. Or that foo b is before the click and ar is after it.

By the way, I’m using jQuery too, I’m happy with pure JS and solutions that use jQ.

Thanks in advance.

Answer 1

Javascript and browsers don’t support this directly, but you could technically wrap each character in a span and do it based on which span was clicked on:

<p>
    <span>f</span>
    <span>o</span>
    <span>o</span>
    <span> </span>
    <span>b</span>
    <span>a</span>
    <span>r</span>
</p>

If anybody actually tries this, be prepared to be eaten by a velociraptor :p