在textarea中的光标位置（字符索引，而不是x / y坐标）

如何使用jQuery获得脱字号在textarea中的位置？ 我正在寻找从文本开始的光标的偏移量，而不是（x，y）位置 。

Answer 1

不是jQuery，但只是Javascript …

var position = window.getSelection().getRangeAt(0).startOffset; 

Answer 2

修改了BojanG的解决scheme来处理jQuery。 在Chrome，FF和IEtesting。

 (function ($, undefined) { $.fn.getCursorPosition = function() { var el = $(this).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; } return pos; } })(jQuery); 

基本上，要在文本框中使用它，请执行以下操作：

 $("#myTextBoxSelector").getCursorPosition(); 

Answer 3

 function caretPos(el) { var pos = 0; // IE Support if (document.selection) { 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; } // Firefox support else if (el.selectionStart || el.selectionStart == '0') pos = el.selectionStart; return pos; } 

Answer 4

我已经做了一些使用这个jQuery掩码input插件的工作 ，发现插入符号function真的很有用。 我从上面的插件中提取了这段代码

 $.fn.caret = function (begin, end) { if (this.length == 0) return; if (typeof begin == 'number') { end = (typeof end == 'number') ? end : begin; return this.each(function () { if (this.setSelectionRange) { this.setSelectionRange(begin, end); } else if (this.createTextRange) { var range = this.createTextRange(); range.collapse(true); range.moveEnd('character', end); range.moveStart('character', begin); try { range.select(); } catch (ex) { } } }); } else { if (this[0].setSelectionRange) { begin = this[0].selectionStart; end = this[0].selectionEnd; } else if (document.selection && document.selection.createRange) { var range = document.selection.createRange(); begin = 0 - range.duplicate().moveStart('character', -100000); end = begin + range.text.length; } return { begin: begin, end: end }; } } 

一旦你创build了这个function，你可以做如下的操作。 再一次，这个函数是从上面提到的jQuery maskedinput函数中获取的。

 $("#id").caret(); //get the begin/end caret position $("#id").caret().begin; $("#id").caret().end; $("#otherId").caret(5); //set the caret position by index $("#otherId").caret(1, 5); //select a range 

Answer 5

这也适用于IE9，Firefox和Chrome：

 (function ($, undefined) { $.fn.getCursorPosition = function() { var el = $(this).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; } return pos; } })(jQuery); 

而且我认为Ryan的版本更清晰

Answer 6

 function doGetCaretPosition(ctrl) { var CaretPos = 0; // IE Support if (document.selection) { ctrl.focus(); var Sel = document.selection.createRange(); Sel.moveStart('character', -ctrl.value.length); CaretPos = Sel.text.length; } // Firefox support else if (ctrl.selectionStart || ctrl.selectionStart == '0') CaretPos = ctrl.selectionStart; return (CaretPos); }