JQuery如何在光标位置插入内容的实现代码

最新推荐文章于 2023-01-28 23:00:00 发布

前端爱好者。

最新推荐文章于 2023-01-28 23:00:00 发布

阅读量356

点赞数

分类专栏：前端文章标签： jQuery

原文链接：https://www.mk2048.com/blog/blog.php?id=2ajjai2ib&title=JQuery%E5%A6%82%E4%BD%95%E5%9C%A8%E5%85%89%E6%A0%87%E4%BD%8D%E7%BD%AE%E6%8F%92%E5%85%A5%E5%86%85%E5%AE%B9%E7%9A%84%E5%AE%9E%E7%8E%B0%E4%BB%A3%E7%A0%81

版权

前端专栏收录该内容

483 篇文章 4 订阅

订阅专栏

                        
  我们在系统开发时经常会遇到在光标处插入内容的实现方式，IE下可以通过 document.selectIOn.createRange ();来实现，而Firefox（火狐）浏览器则 需要首先获取光标位置，然后对value进行字符串截取处理 
  
  代码如下: 
 
   (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);  
 
  使用方法代码如下: 
 
   $(selector).insertAtCaret("value");