Current x, y coordinates of the cursor in the text area using javascript

Question

How can I get the current x and y position of my CURSOR in the text area using javascript. Event is a Keyup event, not a mouse event.

I am not looking for the current cursor position in terms of a charecter, but x, y coordinates.

Answer 1

The only somewhat reliable method I can think of is as follows:

• Create <span>off-screen (absolutely positioned path to the left)
• Give it the same font characteristics as the input element.
• Continuously fill it with text from the input element, but up to the caret
• javascript, .
• , , .

, , .

Answer 2

:

 $(document).ready(function(){
    $('textarea').bind('keyup', function(e){
      var $this = $(this);
      alert('X: ' + $this.data('mousepos').x + '\nY: ' + $this.data('mousepos').y);
    });

    $('textarea').bind('mousemove', function(e){
      $(e.target).data('mousepos', {x: e.pageX, y: e.pageY});
    });
 });​

: http://jsbin.com/ibowa3/edit

Answer 3

event.pagex, LayerX, clientX, screenX - , DOM . .