你如何获得textarea中的光标位置？

我有一个textarea，我想知道如果我在textarea的最后一行或textarea的第一行与我的光标与JavaScript。

我想抓住第一个换行符和最后一个换行符的位置，然后抓住光标的位置。

var firstNewline = $('#myTextarea').val().indexOf('\n'); var lastNewline = $('#myTextarea').val().lastIndexOf('\n'); var cursorPosition = ?????; if (cursorPosition < firstNewline) // I am on first line. else if (cursorPosition > lastNewline) // I am on last line. 

• 是否有可能抓住textarea内的光标位置？
• 你有更好的build议，看看我是否在textarea的第一行或最后一行？

jQuery解决scheme首选，除非JavaScript是简单或更简单。

任何帮助深表感谢。

Answer 1

如果没有select，你可以使用属性.selectionStart或.selectionEnd （没有select他们是平等的）。

 var cursorPosition = $('#myTextarea').prop("selectionStart"); 

请注意，这在旧版浏览器中不受支持，最值得注意的是IE8-。 在那里你将不得不使用文本范围，但这是一个完全的挫折。

不过，我相信在某个地方有一个图书馆是专门用来获取和设置input元素中的select/光标位置的。 我不记得它的名字，但似乎有几十关于这个问题的文章。

Answer 2

我已经做了相当多的工作，并发布了一个函数，用于在Stack Overflow的textareas中多次获取插入/select位置。 与其他几乎所有其他代码不同，它可以在IE <9中换行。

以下是一些具有背景的示例问题：

是否有Internet Explorer批准的替代品selectionStart和selectionEnd？

这里是我写的一个jQuery插件的链接，包括这个函数和其他与select相关的textarea函数：

https://github.com/timdown/rangyinputs

Answer 3

这是我在标准库中的一个跨浏览器function：

 function getCursorPos(input) { if ("selectionStart" in input && document.activeElement == input) { return { start: input.selectionStart, end: input.selectionEnd }; } else if (input.createTextRange) { var sel = document.selection.createRange(); if (sel.parentElement() === input) { var rng = input.createTextRange(); rng.moveToBookmark(sel.getBookmark()); for (var len = 0; rng.compareEndPoints("EndToStart", rng) > 0; rng.moveEnd("character", -1)) { len++; } rng.setEndPoint("StartToStart", input.createTextRange()); for (var pos = { start: 0, end: len }; rng.compareEndPoints("EndToStart", rng) > 0; rng.moveEnd("character", -1)) { pos.start++; pos.end++; } return pos; } } return -1; } 

像这样在你的代码中使用它：

 var cursorPosition = getCursorPos($('#myTextarea')[0]) 

这是它的补充function：

 function setCursorPos(input, start, end) { if (arguments.length < 3) end = start; if ("selectionStart" in input) { setTimeout(function() { input.selectionStart = start; input.selectionEnd = end; }, 1); } else if (input.createTextRange) { var rng = input.createTextRange(); rng.moveStart("character", start); rng.collapse(); rng.moveEnd("character", end - start); rng.select(); } } 

http://jsfiddle.net/gilly3/6SUN8/

Answer 4

这里是获取行号和列位置的代码

 function getLineNumber(tArea) { return tArea.value.substr(0, tArea.selectionStart).split("\n").length; } function getCursorPos() { var me = $("textarea[name='documenttext']")[0]; var el = $(me).get(0); var pos = 0; if ('selectionStart' in el) { pos = el.selectionStart; } else if ('selection' in document) { el.focus(); var Sel = document.selection.createRange(); var SelLength = document.selection.createRange().text.length; Sel.moveStart('character', -el.value.length); pos = Sel.text.length - SelLength; } var ret = pos - prevLine(me); alert(ret); return ret; } function prevLine(me) { var lineArr = me.value.substr(0, me.selectionStart).split("\n"); var numChars = 0; for (var i = 0; i < lineArr.length-1; i++) { numChars += lineArr[i].length+1; } return numChars; } 

tArea是文本区DOM元素

Answer 5

getCursorPos（）函数将返回GWT中的光标位置

  TextArea content = new TextArea(); content.getCursorPos();