是否有可能计算出ap的文本中发生了鼠标点击事件？

2018-06-16 19:34:18

我有一个包含文本的<p> 。当点击<p>时，我创建了一个包含<p>本的<textarea> <p> 。是否可以计算<p>文本中发生点击的位置，并将<textarea>的光标移动到同一点？

我不相信，不。 DOM只是知道包含收到单击事件的元素，它不会区分包含元素中的文本片段，除非它们本身就是元素。我怀疑你想用自己的元素标签来包装文字中的每个字符:)

希望这个简单的例子有助于

<html>
<head/>

<body>
<script type='text/javascript'>

function getPosition() 
{   
        var currentRange=window.getSelection().getRangeAt(0);   
        return currentRange.endOffset;
}

function setPosition(elemId, caretPos) {
    var elem = document.getElementById(elemId);

    if(elem != null) {
        if(elem.createTextRange) {
            var range = elem.createTextRange();
            range.move('character', caretPos);
            range.select();
        }
        else {
            if(elem.selectionStart) {
                elem.focus();
                elem.setSelectionRange(caretPos, caretPos);
            }
            else
                elem.focus();
        }
    }
}

function test()
{
    setPosition('testId', getPosition());
}


</script>
<p onclick = 'test()'>1234567890</p>
<textarea  id='testId'>123467890</textarea>
</body>
</html>

或者您可以使用第三方JS库（如jQuery） - 请参阅此示例。

我猜这需要花费相当多的时间来纠正错误，否则你将无法完全正确。但是你可能会想使用event.clientX和event.clientY。

编辑 - 当我回答时不知道这些东西。看起来很可能让它完全正确。 http://www.quirksmode.org/dom/range_intro.html

另一种想法是：对textarea进行设计，使其看起来像纯文本，并在被点击时将其重新设置为表单字段。

链接地址: http://www.djcxy.com/p/47571.html

上一篇: Is it possible to work out where in a p's text a mouse click event occurred?

下一篇: Integrating my RESTful web app with clients' SAP installations