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 相关文章推荐
ExtJS的FieldSet的column列布局
Nov 20 Javascript
jQuery获取浏览器中的分辨率实现代码
Apr 23 Javascript
javascript中一些util方法汇总
Jun 10 Javascript
JavaScript入门系列之知识点总结
Mar 24 Javascript
JavaScript实现移动端滑动选择日期功能
Jun 21 Javascript
Vue header组件开发详解
Jan 26 Javascript
Vue实现6位数密码效果
Aug 18 Javascript
Vue项目自动转换 px 为 rem的实现方法
Oct 29 Javascript
Vue.js@2.6.10更新内置错误处机制Fundebug同步支持相应错误监控
May 13 Javascript
vue webpack重写cookie路径的方法
Jul 10 Javascript
快速解决layui弹窗按enter键不停弹窗的问题
Sep 18 Javascript
JS函数本身的作用域实例分析
Mar 16 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
PHP 中关于ord($str)&amp;gt;0x80的详细说明
2012/09/23 PHP
Yii框架分页技术实例分析
2019/08/30 PHP
由prototype_1.3.1进入javascript殿堂-类的初探
2006/11/06 Javascript
jquery select(列表)的操作(取值/赋值)
2009/08/06 Javascript
jQuery Clone Bug解决代码
2010/12/22 Javascript
JavaScript自定义DateDiff函数(兼容所有浏览器)
2012/03/01 Javascript
JavaScript声明变量时为什么要加var关键字
2014/09/29 Javascript
Angularjs material 实现搜索框功能
2016/03/08 Javascript
jQuery插件简单学习实例教程
2016/07/01 Javascript
ES6新特性四:变量的解构赋值实例
2017/04/21 Javascript
vue里input根据value改变背景色的实例
2018/09/29 Javascript
微信小程序转发事件实现解析
2019/10/22 Javascript
JS使用正则表达式实现常用的表单验证功能分析
2020/04/30 Javascript
vue 虚拟DOM的原理
2020/10/03 Javascript
JS实现纸牌发牌动画
2021/01/19 Javascript
Python常用的内置序列结构(列表、元组、字典)学习笔记
2016/07/08 Python
Python基于pandas实现json格式转换成dataframe的方法
2018/06/22 Python
python模块导入的细节详解
2018/12/10 Python
捷克浴室和厨房设备购物网站:SIKO
2018/08/11 全球购物
印度排名第一的蛋糕、鲜花和礼品送货:Winni
2019/08/02 全球购物
英国行业制服供应商:Alexandra
2019/09/14 全球购物
长曲棍球装备:Lacrosse Monkey
2020/12/02 全球购物
Linux操作面试题
2012/05/16 面试题
一道输出判断型Java面试题
2014/10/01 面试题
素食餐饮项目创业计划书
2014/02/02 职场文书
中专毕业生自我鉴定
2014/02/02 职场文书
大学生军训自我鉴定
2014/02/12 职场文书
说明书怎么写
2014/05/06 职场文书
港澳通行证委托书怎么写
2014/08/02 职场文书
大学生职业生涯规划大赛作品(精品)
2014/09/17 职场文书
股东出资证明书范例
2014/10/04 职场文书
党的群众路线教育实践活动个人自我剖析材料
2014/10/07 职场文书
2014年保卫科工作总结
2014/12/05 职场文书
员工工作失职检讨书范文!
2019/07/03 职场文书
Redis5之后版本的高可用集群搭建的实现
2021/04/27 Redis
Java使用HttpClient实现文件下载
2022/08/14 Java/Android