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 权威指南(第四版) 读书笔记
Aug 11 Javascript
javascript中的array数组使用技巧
Jan 31 Javascript
jquery ajax跨域解决方法(json方式)
Feb 04 Javascript
jQuery插件slider实现拖动滑块选取价格范围
Apr 30 Javascript
javascript实现在网页中运行本地程序的方法
Feb 03 Javascript
Angular2内置指令NgFor和NgIf详解
Aug 03 Javascript
angular-ui-sortable实现可拖拽排序列表
Dec 28 Javascript
Vue组件选项props实例详解
Aug 18 Javascript
解决vue+element 键盘回车事件导致页面刷新的问题
Aug 25 Javascript
微信小程序API—获取定位的详解
Apr 30 Javascript
整理 node-sass 安装失败的原因及解决办法(小结)
Feb 19 Javascript
vue大型项目之分模块运行/打包的实现
Sep 21 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
wamp服务器访问php非常缓慢的解决过程
2015/07/01 PHP
Yii实现文章列表置顶功能示例
2016/10/18 PHP
php压缩文件夹最新版
2018/07/18 PHP
Javascript操纵Cookie实现购物车程序
2007/02/15 Javascript
学习jquery之一
2007/04/27 Javascript
完美解决IE不支持Data.parse()的问题
2016/11/24 Javascript
JS实现数组去重复值的方法示例
2017/02/18 Javascript
JS正则获取HTML元素的方法
2017/03/31 Javascript
Vuex和前端缓存的整合策略详解
2017/05/09 Javascript
vuejs事件中心管理组件间的通信详解
2017/08/09 Javascript
js实现移动端轮播图效果
2020/12/09 Javascript
微信小程序下拉刷新界面的实现
2017/09/28 Javascript
原生JS实现ajax与ajax的跨域请求实例
2017/12/01 Javascript
Bootstrap导航菜单点击后无法自动添加active的处理方法
2018/08/10 Javascript
Vue动态获取width的方法
2018/08/22 Javascript
详解react内联样式使用webpack将px转rem
2018/09/13 Javascript
记录vue项目中遇到的一点小问题
2019/05/14 Javascript
JQuery使用数组遍历跳出each循环
2020/09/01 jQuery
python处理图片之PIL模块简单使用方法
2015/05/11 Python
python list排序的两种方法及实例讲解
2017/03/20 Python
使用Python通过win32 COM实现Word文档的写入与保存方法
2018/05/08 Python
Tensorflow卷积神经网络实例
2018/05/24 Python
flask利用flask-wtf验证上传的文件的方法
2020/01/17 Python
JD Sports德国官网:英国领先的运动鞋和运动服饰零售商
2018/02/26 全球购物
国家地理在线商店:Shop National Geographic
2018/06/30 全球购物
机械设计职业生涯规划书
2013/12/27 职场文书
应届生求职信范文
2014/05/26 职场文书
大学生安全责任书
2014/07/25 职场文书
五四青年节的活动方案
2014/08/20 职场文书
2014村党支部书记党建工作汇报材料
2014/11/02 职场文书
计划生育诚信协议书
2014/11/02 职场文书
项目备案申请报告
2015/05/15 职场文书
全陪导游词开场白
2015/05/29 职场文书
药品销售员2015年终工作总结
2015/10/22 职场文书
优秀党员先进事迹材料2016
2016/02/29 职场文书
Python中的socket网络模块介绍
2022/07/23 Python