How to get text cursor position using javascript

Question

this is my code ,i fill space all in div ,(use jquery):

<div id="a" style="position:absolute;top:300px;width:100px;height:100px;background:red;color:black;word-wrap:break-word;">
    <div id='a2' contenteditable=true ></div>
</div>
<script type="text/javascript">
    String.prototype.repeat = function(n) {
        return new Array(1 + parseInt(n, 10)).join(this);
    }

    var s=$('#a').width()/4*$('#a').height()/19;
    $('#a2').html('&nbsp;'.repeat($('#a').width()/4*parseInt($('#a').height()/19)))

    $('#a2').click(function(){
        alert('sss')
    })

</script>

so how can i get the text cursor position when i click somewhere in 'a2' div

the demo is http://jsfiddle.net/KBnKc/

thanks

@Šime true, but it contains a div with contenteditable=true. — Pekka
– Pekka, Commented Nov 26, 2010 at 20:12
What do you want to do with the caret position once you've got it? — Tim Down
– Tim Down, Commented Nov 26, 2010 at 20:32

Community · Accepted Answer · 2017-05-23 12:32:59Z

3

~~You can use the pageX and pageY property of the jQuery event object:~~

~~$('#a2').click(function(e) { alert(e.pageX + ", " + e.pageY); });~~

~~The returned coordinates are relative to the top left of the document.~~

You might want to use the A-Tools plugin, more specifically its getSelection() method. It returns the caret position if no text is selected.

By the way, the "text cursor" is called the caret :)

EDIT: The aforementioned plugin will not work with contenteditable <div>elements. While looking for another solution, I found that question which is a duplicate of yours. Maybe the responses there can help you.

edited May 23, 2017 at 12:32

CommunityBot

11 silver badge

answered Nov 26, 2010 at 20:14

Frédéric Hamidi

264k42 gold badges497 silver badges486 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

zjm1126 Over a year ago

sorry , i want to get the text cursor .

Šime Vidas Over a year ago

édéric Are you sure that getSelection() works on contenteditable DIV elements?

ArBR · Accepted Answer · 2010-11-26 20:23:28Z

0

you can use Prototype.js to get mouse position:

var x, y;
function getCoordinatesInsideElement(e)
{
    x = Event.pointerX(e);
    y = Event.pointerY(e);
    /* DO-SOMETHING */
}

See prototype reference at: http://api.prototypejs.org/

answered Nov 26, 2010 at 20:23

ArBR

4,1122 gold badges26 silver badges30 bronze badges

Collectives™ on Stack Overflow

How to get text cursor position using javascript

2 Answers 2

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related