查找插入点当前放置在textarea/contenteditable中的位置是

Question

我目前正在尝试创建动态文本区域，尽管我面临的问题是某些区域必须阻止事件实现，而我已经得出结论，我需要找出插入点位于当前textarea或contenteditable divider中的位置。

我用的事件​​和jQuery的keyup但当点击上分隔做他们不登录，我不知道要寻找什么在event对象找到我后，我。

例如，如果我在一个空的textarea并点击textarea，它将返回0，因为它在开头 - 如果我要写文本，它会返回数字，因为更多的字符被插入到textarea的。

Answer 1

您可以使用textarea的selectionStart和selectionEnd属性。对于contenteditable元素，您可以使用window.getSelection()。

$('#text1').on('keyup click', function() { 
 
    console.log('Selection start :', $(this).prop('selectionStart')); 
 
    console.log('Selection end :', $(this).prop('selectionEnd')); 
 
}); 
 

 
$('#text2').on('keyup click', function() { 
 
    console.log(window.getSelection().getRangeAt(0).startOffset); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<textarea id="text1"></textarea> 
 
<div id="text2" contenteditable>some text</div>