Как получить положение курсора текста с помощью JavaScript - PullRequest
3 голосов
/ 26 ноября 2010

это мой код, я заполняю все пространство в div, (используйте 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>

так, как я могу получить положение курсора текста, когда я нажимаю где-нибудь в 'a2' div

демо-версия http://jsfiddle.net/KBnKc/

спасибо

Ответы [ 2 ]

2 голосов
/ 26 ноября 2010

Вы можете использовать свойство pageX и pageY объекта jQuery object:

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

Возвращенные координаты относятся к верхнему левому углу документа.

Возможно, вы захотите использовать плагин A-Tools , точнее его метод getSelection(). Возвращает позицию каретки, если текст не выделен.

Кстати, «текстовый курсор» называется кареткой:)

РЕДАКТИРОВАТЬ: Вышеупомянутый плагин не будет работать с contenteditable <div> элементами. В поисках другого решения я нашел этот вопрос , который является вашим дубликатом. Может быть, ответы там могут помочь вам.

0 голосов
/ 26 ноября 2010

вы можете использовать Prototype.js , чтобы получить положение мыши:

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

См. Ссылку на прототип по адресу: http://api.prototypejs.org/

...