JS在TextArea光标位置插入文字并实现移动光标到文字末尾


Posted in Javascript onJune 21, 2013

=IE支持document.selection
=Firefox,Chrome,Safari以及Opera都有selectionStart和selectionEnd属性

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; 
} 
}

<input type="button" onclick="insertText(document.getElementById('text'),' 新文字—YoyiorLee ')" value="插入文字"></input>

<input type="button" onclick="moveEnd(document.getElementById('text'))" value="移到末尾"></input>
Javascript 相关文章推荐
Javascript的匿名函数小结
Dec 31 Javascript
js中如何把字符串转化为对象、数组示例代码
Jul 17 Javascript
JS验证邮箱格式是否正确的代码
Dec 05 Javascript
原生js实现复制对象、扩展对象 类似jquery中的extend()方法
Aug 30 Javascript
Node.js node-schedule定时任务隔多少分钟执行一次的方法
Feb 10 Javascript
JavaScript之AOP编程实例
Jul 17 Javascript
jQuery Uploadify 上传插件出现Http Error 302 错误的解决办法
Dec 12 Javascript
jQuery通过ajax请求php遍历json数组到table中的代码(推荐)
Jun 12 Javascript
纯js和css完成贪吃蛇小游戏demo
Sep 01 Javascript
JavaScript树的深度优先遍历和广度优先遍历算法示例
Jul 30 Javascript
详解vue-cli 2.0配置文件(小结)
Jan 14 Javascript
vue中$refs, $emit, $on, $once, $off的使用详解
May 26 Javascript
JS获得URL超链接的参数值实例代码
Jun 21 #Javascript
随窗体滑动的小插件sticky源码
Jun 21 #Javascript
jquery中文乱码的多种解决方法
Jun 21 #Javascript
js单向链表的具体实现实例
Jun 21 #Javascript
javascript setTimeout和setInterval计时的区别详解
Jun 21 #Javascript
js简易namespace管理器 实例代码
Jun 21 #Javascript
JavaScript中的this关键字介绍与使用实例
Jun 21 #Javascript
You might like
php5 apache 2.2 webservice 创建与配置(java)
2011/01/27 PHP
php中使用explode查找某个字符是否存在的方法
2011/07/12 PHP
做了CDN获取用户真实IP的函数代码(PHP与Asp设置方式)
2013/04/13 PHP
PHP检测移动设备类mobile detection使用实例
2014/04/14 PHP
php实现按文件名搜索文件的远程文件查找器
2014/05/10 PHP
PHP生成指定长度随机数最简洁的方法
2014/07/14 PHP
使用PHP如何实现高效安全的ftp服务器(一)
2015/12/20 PHP
laravel返回统一格式错误码问题
2019/11/04 PHP
PHP使用openssl扩展实现加解密方法示例
2020/02/20 PHP
dojo学习第二天 ajax异步请求之绑定列表
2011/08/29 Javascript
运算符&amp;&amp;的三个不同层次
2013/04/07 Javascript
Get中文乱码IE浏览器Get中文乱码解决方案
2013/12/26 Javascript
浅析javascript的间隔调用和延时调用
2014/11/12 Javascript
Javascript字符串浏览器兼容问题分析
2014/12/01 Javascript
js数组依据下标删除元素
2015/04/14 Javascript
D3.js实现散点图和气泡图的方法详解
2016/09/21 Javascript
jQuery插件HighCharts实现的2D回归直线散点效果示例【附demo源码下载】
2017/03/09 Javascript
vue中appear的用法
2017/08/17 Javascript
Vue数据双向绑定原理及简单实现方法
2018/05/18 Javascript
Javascript数组方法reduce的妙用之处分享
2019/06/10 Javascript
解决vue打包后刷新页面报错:Unexpected token
2019/08/27 Javascript
[59:08]Ti4 冒泡赛第二天 NEWBEE vs Titan 2
2014/07/15 DOTA
跟老齐学Python之一个免费的实验室
2014/09/14 Python
使用Python的PEAK来适配协议的教程
2015/04/14 Python
python 实现红包随机生成算法的简单实例
2017/01/04 Python
深入理解Python中range和xrange的区别
2017/11/26 Python
python 中字典嵌套列表的方法
2018/07/03 Python
pycharm使用matplotlib.pyplot不显示图形的解决方法
2018/10/28 Python
关于pytorch多GPU训练实例与性能对比分析
2019/08/19 Python
Python绘制二维曲线的日常应用详解
2019/12/04 Python
Python爬虫库BeautifulSoup的介绍与简单使用实例
2020/01/25 Python
python3排序的实例方法
2020/10/20 Python
公司爱心捐款倡议书
2014/05/14 职场文书
营销总监岗位职责
2014/09/16 职场文书
技术员个人工作总结
2015/03/03 职场文书
纯 CSS 自定义多行省略的问题(从原理到实现)
2021/11/11 HTML / CSS