Jquery在光标位置插入内容的代码分享

发布时间:2020-11-18编辑:脚本学堂
本文介绍下,用jquery实现在光标位置插入内容的一段代码,分享给大家,有需要的朋友参考下。

注意:
实现在光标位置插入代码功能时,不同的浏览器下,方法略有不同。
IE下可以通过document.selection.createRange();实现。
Firefox(火狐)浏览器需要先获取光标位置,然后对value进行字符串截取处理。

来看具体的实现代码:

<script>
/**
* 在光标位置插入内容
* edit by www.jb200.com
*/
(function($){
$.fn.extend({
insertAtCaret: function(myValue){
var $t=$(this)[0];
if (document.selection) {
this.focus();
sel = document.selection.createRange();
sel.text = myValue;
this.focus();
}
else
if ($t.selectionStart || $t.selectionStart == '0') {
var startPos = $t.selectionStart;
var endPos = $t.selectionEnd;
var scrollTop = $t.scrollTop;
$t.value = $t.value.substring(0, startPos) + myValue + $t.value.substring(endPos, $t.value.length);
this.focus();
$t.selectionStart = startPos + myValue.length;
$t.selectionEnd = startPos + myValue.length;
$t.scrollTop = scrollTop;
}
else {
this.value += myValue;
this.focus();
}
}
})
})(jquery);
<script>

调用示例:

$(selector).insertAtCaret("value"); //指定光标位置插入内容