如何解决在文本区域中按Enter键不能正确更改光标索引
在javascript中，我们可以使用文本输入元素的element.selectionStart或element.seletionEnd属性获取textarea元素中光标的“索引”。因此，在第0行（第一行）上时，40列10行的文本区域的光标位置应为0-40。但是，当您按Enter键时，将光标移至文本输入元素中的下一行时，光标位置不会相应更新。实际上，按Enter键仅具有向文本区域添加单个空格的效果，因此使光标位置比按Enter键之前的位置高1+。为什么会这样，并且有办法达到将光标位置更新到下一行的预期效果吗？
我提供了以下代码段，以更好地解释我在说什么。
var input = document.getElementById("PMCDefMsgtxt");
input.addEventListener("keyup",function(event) {
// Number 13 is the "Enter" key on the keyboard
if (event.keyCode === 13) {
event.preventDefault();
// should log to the console the cursor position
console.log(input.selectionEnd);
}
});<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<textarea rows="10" cols="40" class="fwMultilineTextbox" id="PMCDefMsgtxt" name="PMCDefMsgtxt"
style="width: 550px; height: 125px; margin-left: auto;"></textarea>
</body>
</html>解决方法
1110100 1100101 1110011 1110100
键实际上是输入一个换行符，因此它将不计算其余的列，而仅计算换行符。
如果要计算每个enter上的列数，则必须定义一个变量，该变量在每个enter上添加列数。换句话说，在事件侦听器中，当enter等于40 - element.selectionEnd时，必须将该数字（例如keyCode）添加到变量中。
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。