JS在textarea光标处插入文本的小例子


Posted in Javascript onMarch 22, 2013

下面是代码:

--------------------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JS在文本域鼠标指定位置插入文本-柯乐义</title>
<script type="text/javascript">
function insertAtCursor(myField, myValue) {
//IE support
if (document.selection) {
myField.focus();
sel = document.selection.createRange();
sel.text = myValue;
sel.select();
}
//MOZILLA/NETSCAPE support 
else if (myField.selectionStart || myField.selectionStart == '0') {
var startPos = myField.selectionStart;
var endPos = myField.selectionEnd;
// save scrollTop before insert www.keleyi.com
var restoreTop = myField.scrollTop;
myField.value = myField.value.substring(0, startPos) + myValue + myField.value.substring(endPos, myField.value.length);
if (restoreTop > 0) {
myField.scrollTop = restoreTop;
}
myField.focus();
myField.selectionStart = startPos + myValue.length;
myField.selectionEnd = startPos + myValue.length;
} else {
myField.value += myValue;
myField.focus();
}
} 
</script>
</head>
<body>
<div style="width:500px;margin-left:auto;margin-right:auto;margin-top:100px;">
<textarea id="keleyi_com" style="width:340px; height:180px">
柯乐义 Javascript 在textarea光标处插入文本
</textarea>
<input type="button" onclick="insertAtCursor(document.getElementById('keleyi_com'),'www.keleyi.com')" value="插入文本" />
</div></body>
</html>
Javascript 相关文章推荐
ECMAScript 基础知识
Jun 29 Javascript
jquery 插件 人性化的消息显示
Jan 21 Javascript
jQuery.Validate 使用笔记(jQuery Validation范例 )
Jun 25 Javascript
Javascript验证用户输入URL地址是否为空及格式是否正确
Oct 09 Javascript
jQuery中first()方法用法实例
Jan 06 Javascript
JavaScript输出当前时间Unix时间戳的方法
Apr 06 Javascript
javascript 常见功能汇总
Jun 11 Javascript
js实现网页图片延时加载 提升网页打开速度
Jan 26 Javascript
用AngularJS来实现监察表单按钮的禁用效果
Nov 02 Javascript
JS获取子节点、父节点和兄弟节点的方法实例总结
Jul 06 Javascript
vue基础之v-bind属性、class和style用法分析
Mar 11 Javascript
layui给下拉框、按钮状态、时间赋初始值的方法
Sep 10 Javascript
JavaScript 验证码的实例代码(附效果图)
Mar 22 #Javascript
jquery实现图片等比例缩放以及max-width在ie中不兼容解决
Mar 21 #Javascript
jQuery+css+html实现页面遮罩弹出框
Mar 21 #Javascript
jquery实现固定顶部导航效果(仿蘑菇街)
Mar 21 #Javascript
jquery实现网站超链接和图片提示效果
Mar 21 #Javascript
jquery 表格的增行删行实现思路
Mar 21 #Javascript
杨氏矩阵查找的JS代码
Mar 21 #Javascript
You might like
受疫情影响 动画《Re从零开始的异世界生活》第二季延期至7月
2020/03/10 日漫
PHP调用Webservice实例代码
2011/07/29 PHP
关于PHP内置的字符串处理函数详解
2017/02/04 PHP
利用PHP获取汉字首字母并且分组排序详解
2017/10/22 PHP
jquery表单验证使用插件formValidator
2012/11/10 Javascript
jquery 触发a链接点击事件解决方案
2013/05/02 Javascript
JavaScript中window.showModalDialog()用法详解
2014/12/18 Javascript
javascript中String对象的slice()方法分析
2014/12/20 Javascript
jQuery实现手机号码输入提示功能实例
2015/04/30 Javascript
JavaScript中对象的不同创建方法
2016/08/12 Javascript
JS实现页面载入时随机显示图片效果
2016/09/07 Javascript
学习JavaScript图片预加载模块
2016/11/07 Javascript
基本DOM节点操作
2017/01/17 Javascript
轻松学习Javascript闭包
2017/03/01 Javascript
JavaScript取得gridview中获取checkbox选中的值
2017/07/24 Javascript
JavaScript编程设计模式之观察者模式(Observer Pattern)实例详解
2017/10/25 Javascript
js定时器+简单的动画效果实例
2017/11/10 Javascript
基于bootstrap页面渲染的问题解决方法
2018/08/09 Javascript
详解基于Vue/React项目的移动端适配方案
2019/08/23 Javascript
vue-resource:jsonp请求百度搜索的接口示例
2019/11/09 Javascript
vue项目接口域名动态获取操作
2020/08/13 Javascript
介绍Python中的文档测试模块
2015/04/28 Python
python学习必备知识汇总
2017/09/08 Python
使用anaconda的pip安装第三方python包的操作步骤
2018/06/11 Python
浅谈pandas用groupby后对层级索引levels的处理方法
2018/11/06 Python
Python hashlib模块的使用示例
2020/10/09 Python
HTML5事件方法全部汇总
2016/05/12 HTML / CSS
蔻驰西班牙官网:COACH西班牙
2019/01/16 全球购物
意大利中国电子产品购物网站:Geekmall.com
2019/09/30 全球购物
文明美德伴我成长演讲稿
2014/05/12 职场文书
母亲节感言
2015/08/03 职场文书
国际贸易实训总结
2015/08/03 职场文书
总结一些Java常用的加密算法
2021/06/11 Java/Android
为什么在foreach循环中JAVA集合不能添加或删除元素
2021/06/11 Java/Android
Python IO文件管理的具体使用
2022/03/20 Python
Python软件包安装的三种常见方法
2022/07/07 Python