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 相关文章推荐
JavaScript中Math对象使用说明
Jan 16 Javascript
动态加载外部javascript文件的函数代码分享
Jul 28 Javascript
javascript继承之为什么要继承
Nov 10 Javascript
JQuery入门——用bind方法绑定事件处理函数应用介绍
Feb 05 Javascript
js操作label给label赋值及取label的值示例
Nov 07 Javascript
微信小程序 详解页面跳转与返回并回传数据
Feb 13 Javascript
vue-router 权限控制的示例代码
Sep 21 Javascript
vue2.0实现移动端的输入框实时检索更新列表功能
May 08 Javascript
原生js实现抽奖小游戏
Jun 27 Javascript
JavaScript JSON数据处理全集(小结)
Aug 15 Javascript
非常漂亮的js烟花效果
Mar 10 Javascript
javascript实现简单页面倒计时
Mar 02 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
PHP出错界面
2006/10/09 PHP
随时给自己贴的图片加文字的php水印
2007/03/16 PHP
php中使用接口实现工厂设计模式的代码
2012/06/17 PHP
WordPres对前端页面调试时的两个PHP函数使用小技巧
2015/12/22 PHP
PHP 实现字符串翻转(包含中文汉字)的实现代码
2017/04/01 PHP
php基于环形链表解决约瑟夫环问题示例
2017/11/07 PHP
Hutia 的 JS 代码集
2006/10/24 Javascript
jQuery 学习入门篇附实例代码
2010/03/16 Javascript
仿微博字符限制效果实现代码
2012/04/20 Javascript
javascript定时变换图片实例代码
2013/03/17 Javascript
使用js完成节点的增删改复制等的操作
2014/01/02 Javascript
基于JavaScript实现移动端TAB触屏切换效果
2015/10/20 Javascript
实例讲解使用原生JavaScript处理AJAX请求的方法
2016/05/10 Javascript
JS实现添加,替换,删除节点元素的方法
2016/06/30 Javascript
浅谈Javascript中的函数、this以及原型
2016/10/09 Javascript
分享十三个最佳JavaScript数据网格库
2017/04/07 Javascript
Javascript实现从小到大的数组转换成二叉搜索树
2017/06/13 Javascript
Node.JS使用Sequelize操作MySQL的示例代码
2017/10/09 Javascript
微信小程序定位当前城市的方法
2018/07/19 Javascript
jquery实现自定义树形表格的方法【自定义树形结构table】
2019/07/12 jQuery
关于pip的安装,更新,卸载模块以及使用方法(详解)
2017/05/19 Python
python实现图片文件批量重命名
2020/03/23 Python
Python列表(list)所有元素的同一操作解析
2019/08/01 Python
python 已知一个字符,在一个list中找出近似值或相似值实现模糊匹配
2020/02/29 Python
浅谈对python中if、elif、else的误解
2020/08/20 Python
python爬虫实现爬取同一个网站的多页数据的实例讲解
2021/01/18 Python
2014年自我评价
2014/01/04 职场文书
先进事迹报告会感言
2014/01/24 职场文书
遗嘱继承公证书
2014/04/09 职场文书
雏鹰争章活动总结
2014/05/09 职场文书
师德师风的心得体会
2014/09/02 职场文书
预备党员转正党小组意见
2015/06/01 职场文书
军事理论课感想
2015/08/11 职场文书
500字作文之关于爸爸
2019/11/14 职场文书
Pandas数据结构之Series的使用
2022/03/31 Python
《吸血鬼:避世 血猎》官宣4.27发售 系列首款大逃杀
2022/04/03 其他游戏