效果演示

欢迎访问cssfirefly.cnblogs.com

html:

<textarea id="text" style="width:500px;height:80px;">欢迎访问http://cssfirefly.cnblogs.com/</textarea>

<input type="button" value="插入文字" onclick="insertText(document.getElementById('text'),' NewWord ')">
<input type="button" value="插入文字" onclick="moveEnd(document.getElementById('text'))">

js:

代码如下:
function insertText(obj,str) {
if (document.selection) {
var sel = document.selection.createRange();
sel.text = str;
} else if (typeof obj.selectionStart === 'number' && typeof obj.selectionEnd === 'number') {
var startPos = obj.selectionStart,
endPos = obj.selectionEnd,
cursorPos = startPos,
tmpStr = obj.value;
obj.value = tmpStr.substring(0, startPos) + str + tmpStr.substring(endPos, tmpStr.length);
cursorPos += str.length;
obj.selectionStart = obj.selectionEnd = cursorPos;
} else {
obj.value += str;
}
}
function moveEnd(obj){
obj.focus();
var len = obj.value.length;
if (document.selection) {
var sel = obj.createTextRange();
sel.moveStart('character',len);
sel.collapse();
sel.select();
} else if (typeof obj.selectionStart == 'number' && typeof obj.selectionEnd == 'number') {
obj.selectionStart = obj.selectionEnd = len;
}
}

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

  1. JQ在光标处插入文字

    内容转载自网络这是一个JQ的扩展方法.在teatarea获得焦点时,往光标处插入文字,扩展代码如下 (function($){ $.fn.extend({ "insert":fun ...

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

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

  3. textarea光标处插入文字

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

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

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

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

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

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

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

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

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

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

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

  9. js实现文本框文本域光标处插入图片文本的插件(并且光标在插入内容的内容后显示)

    js: /******************************************* * * 插入光标处的插件 * @authors Du xin li * @update    2015 ...

随机推荐

  1. 1.4.2 solr字段类型--(1.4.2.1)字段类型定义和字段类型属性

    1.4.2 solr字段类型 (1.4.2.1) 字段类型定义和字段类型属性. (1.4.2.2) solr附带的字段类型 (1.4.2.3) 使用货币和汇率 (1.4.2.4) 使用Dates(日期 ...

  2. 沈逸老师PHP魔鬼特训笔记(10)

    为了防止代码让我们混淆不清,大家看视频中的分离方法 1.新建了一个文件夹叫code (这代表是代码) 2.再新建一个文件夹叫page (这代表是页面) 代码该怎么写呢? 这里要记住口诀 1.index ...

  3. 【Mood-17】 github中在本地进行上传的时候出现ERROR: Repository not found. fatal: The remote end hung up unexpectedly

    一开始出现这个错误的时候还感觉很奇怪,我明明在在本地中相应的库文件夹命令中输入: vim ./git/config 将文件中的 [remote “origin"]部分去掉!

  4. 【Android 界面效果33】二级listview列表

    今天来实现以下大众点评客户端的横向listview二级列表,先看一下样式. 这种横向的listview二级列表在手机软件上还不太常见,但是使用过平板的都应该知道,在平板上市比较常见的.可能是因为平板屏 ...

  5. iOS 画图讲解

    5.画图 (1)画线 //绘图代码写在drawRect里,view加载完成,需要显示的时候调用 //1.获取图形上下文 2.创建路径 3.把图形放入上下文 4.渲染上下文 //drawRect的rec ...

  6. EasyUI设置复选框单选操作

    Html 代码: <td align="left" colspan="2">                    <input type=& ...

  7. 不停服务情况下升级nginx

    第三方支付平台因安全问题对nginx做了升级操作,为了不影响业务,整个操作过程都不能停服务,因此对升级方法做出了要求.以下为我整理的生产环境实际操作方法,已在第三方支付平台上成功应用,希望对即将或者可 ...

  8. xe5 android sample 中的 SimpleList 是怎样绑定的

    C:\Users\Public\Documents\RAD Studio\12.0\Samples\FireMonkeyMobile 例子中的绑定方式如下图: 1.拖拽一个listview到界面上,然 ...

  9. 浅议tomcat与classloader

    关于tomcat和classloader的文章,网上多如牛毛,且互相转载,所以大多数搜到的基本上是讲到了tomcat中classloader的几个层次,对于初接触classloader,看了之后还是只 ...

  10. IOS的一些尺寸

    iPhone或iTouch的宽为320像素,高为480像素, 状态栏高为20像素 toobar高为44像素 tabbar高为49像素 导航栏高为44像素 iphone分辨率参数 型号 屏幕尺寸 分辨率 ...