内容转载自网络
这是一个JQ的扩展方法。在teatarea获得焦点时,往光标处插入文字,扩展代码如下
(function($){
$.fn.extend({
"insert":function(value){
//默认参数
value=$.extend({
"text":"123"
},value);
var dthis = $(this)[0]; //将jQuery对象转换为DOM元素
//IE下
if(document.selection){
$(dthis).focus(); //输入元素textara获取焦点
var fus = document.selection.createRange();//获取光标位置
fus.text = value.text; //在光标位置插入值
$(dthis).focus(); ///输入元素textara获取焦点
}
//火狐下标准
else if(dthis.selectionStart || dthis.selectionStart == '0'){
var start = dthis.selectionStart;    //获取焦点前坐标
var end =dthis.selectionEnd;   //获取焦点后坐标
//以下这句,应该是在焦点之前,和焦点之后的位置,中间插入我们传入的值 .然后把这个得到的新值,赋给文本框
dthis.value = dthis.value.substring(0, start) + value.text + dthis.value.substring(end, dthis.value.length); }
//在输入元素textara没有定位光标的情况
else{
this.value += value.text; this.focus();
};
return $(this);
}
})
})(jQuery)

扩展方法调用方法为

//给按钮添加点击事件,
$('#btn').on('click',function(){
$("目标textarea框").insert({"text":"要添加的文字"});
});

JQ在光标处插入文字的更多相关文章

  1. textarea光标处插入文字

    (function($) { $.fn.extend({ //myField 对象元素 myValue 插入值 insertAtCursor: function(myField,myValue) { ...

  2. textarea 在光标处插入文字

    效果演示 // 欢迎访问cssfirefly.cnblogs.com html: <textarea id="text" style="width:500px;he ...

  3. 【Javascript】在文本框光标处插入文字并定位光标 (转)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. 可编辑DIV (contenteditable="true") 在鼠标光标处插入图片或者文字

    近期需开发一个DIV做的编辑器,插入表情图片可直接预览效果,仔细参考了下百度贴吧的过滤粘贴过来文件的THML代码,自己整理了下.写出来只是和大家分享下,我自己也不大懂,经过努力,幸好搞定. 蛋疼的事情 ...

  5. 使用JS在textarea在光标处插入内容

    // 在光标处插入字符串 // myField 文本框对象 // myValue 要插入的值 function insertAtCursor(myField, myValue) { //IE supp ...

  6. js在一个可编辑的div光标处插入图片或者文本(兼容ie,火狐等浏览器)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. javascript实现在textarea光标位置插入文字并移动光标到文字末尾

    1.背景:实现在textarea光标位置插入文字并移动光标到文字末尾 如果每次通过val("ss")赋值的形式插入文字到textarea中,会将上一次赋的值覆盖掉. 2.思路: & ...

  8. kindeditor在光标处插入编辑器外的数据

    页面 <div class="form-group clearfix"> <label class="control-label col-sm-3 co ...

  9. textarea在光标位置插入文字

    最近开发类似计算器界面,需要在textarea中编辑公式,涉及到 在光标位置插入 字符. 效果如下: + - * / 添加文字 // html代码如下: <!doctype html> & ...

随机推荐

  1. window下如何使用Git上传代码到github远程服务器上(转)

    注册账户以及创建仓库 首先你得有一个github账号,没有自行注册,登录成功后应该是这样 在页面上方用户菜单上选择 "+"->New repository 创建一个新的仓库 ...

  2. Maven就是这么简单

    什么是Maven Maven是一个采用纯Java编写的开源项目管理工具, Maven采用了一种被称之为Project Object Model (POM)概念来管理项目,所有的项目配置信息都被定义在一 ...

  3. asp.mvc中的vue分页实例,分页组件无法重置reload,解决点击查询按钮后,分页不刷新的问题

    刚刚接触Vue.js,现在需要做一个查询功能,并且进行服务端分页.主要思路是在页面中注册一个分页组件,然后进行调用.代码如下 1.引用vue.js,具体去网上下载 2.在html的body中添加如下代 ...

  4. python︱函数、for、_name_杂记

    新手入门python,开始写一些简单函数,慢慢来,加油~ 一.函数 def myadd(a=1,b=100): result = 0 i = a while i <= b: # 默认值为1+2+ ...

  5. AfxBeginThread和CreateThread具体区别

    1. 具体说来,CreateThread这个函数是windows提供给用户的 API函数,是SDK的标准形式,在使用的过程 中要考虑到进程的同步与互斥的关系,进程间的同步互斥等一系列会导致操作系统死锁 ...

  6. VxWorks 基本启动方式

    VxWorks 基本启动方式     按VxWorks内核的下载形式,VxWorks启动总体上分为两种方式:下载型和ROM 型.     @下载型启动方式:bootrom+VxWorks.此时boot ...

  7. Count:858org.apache.jasper.JasperException: Unable to compile class for JSP

    1.错误描述 Count:858org.apache.jasper.JasperException: Unable to compile class for JSP: An error occurre ...

  8. JSON对象转换成JSON字符串

    1.问题背景 有一个json对象,需要将其转换成json字符串 JSON.stringify(obj) 2.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DT ...

  9. pat1051-1060

    1051 自己写的非常麻烦 http://blog.csdn.net/biaobiaoqi/article/details/9338397 的算法比较好,我的就贴下吧,主要对入栈出栈不够理解 #inc ...

  10. ASP.NET Core轻松入门Bind读取配置文件到C#实例

    首先新建一个ASP.NET Core空项目,命名为BindReader 然后 向项目中添加一个名为appsettings.json的json文件,为什么叫appsettings呢?  打开Progra ...