javascript在一段文字中的光标处插入其他文字


Posted in Javascript onAugust 26, 2007

例如:一个文本框里有一段文字,我要通过点击鼠标并且在相应的地方插入文本
我是这样做的:先获得文本框的值TextArea.Value,然后.TextArea.Value+其他文本

<script type="text/javascript">   
function setCaret(textObj){  
  if(textObj.createTextRange){    
    textObj.caretPos=document.selection.createRange().duplicate();    
  }  
}

function insertAtCaret(textObj,textFeildValue){  
  if(document.all){    
    if(textObj.createTextRange&&textObj.caretPos){      
      var caretPos=textObj.caretPos;      
      caretPos.text=caretPos.text.charAt(caretPos.text.length-1)==''?textFeildValue+'':textFeildValue;
    }else {      
      textObj.value=textFeildValue;      
    }    
  }else {    
    if(textObj.setSelectionRange){      
      var rangeStart=textObj.selectionStart;      
      var rangeEnd=textObj.selectionEnd;      
      var tempStr1=textObj.value.substring(0,rangeStart);      
      var tempStr2=textObj.value.substring(rangeEnd);      
      textObj.value=tempStr1+textFeildValue+tempStr2;      
    }else {      
      alert("This version of Mozilla based browser does not support setSelectionRange");      
    }    
  }  
}    
</script>   

<form id="form1" action="" onsubmit="" method="post" enctype="text/plain">     
<p>   
<textarea name="tarea" rows="" cols="" style="width:300px;height:120px;" onselect="setCaret(this);" onclick="setCaret(this);" onkeyup="setCaret(this);">
Dnew.cn  Dnew.cn
</textarea>   
<br/><br/>   
<input type="text" name="textfield" style="width:220px;" value="插入FireFox"/>   
<br/>   
<input type="button" value="插入" onclick="insertAtCaret(this.form.tarea,this.form.textfield.value);"/>   
</p>   
</form>   

Javascript 相关文章推荐
保证JavaScript和Asp、Php等后端程序间传值编码统一
Apr 17 Javascript
Jquery实现搜索框提示功能示例代码
Aug 13 Javascript
点击进行复制的JS代码实例
Aug 23 Javascript
动态创建script在IE中缓存js文件时导致编码的解决方法
May 04 Javascript
PHP使用方法重载实现动态创建属性的get和set方法
Nov 17 Javascript
jquery实现TAB选项卡鼠标经过带延迟效果的方法
Jul 27 Javascript
深入解读JavaScript中的Hoisting机制
Aug 12 Javascript
轻松实现js图片预览功能
Jan 18 Javascript
Bootstrap笔记之缩略图、警告框实例详解
Mar 09 Javascript
JavaScript数据结构之链表的实现
Mar 19 Javascript
vue的keep-alive用法技巧
Aug 15 Javascript
Vue + element 实现多选框组并保存已选id集合的示例代码
Jun 03 Javascript
有一段有意思的代码-javascript现实多行信息
Aug 26 #Javascript
LBS blog sql注射漏洞[All version]-官方已有补丁
Aug 26 #Javascript
javascript下操作css的float属性的特殊写法
Aug 22 #Javascript
ASP中用Join和Array,可以加快字符连接速度的代码
Aug 22 #Javascript
可以把编码转换成 gb2312编码lib.UTF8toGB2312.js
Aug 21 #Javascript
lib.utf.js
Aug 21 #Javascript
javascript实现上传图片前的预览(TX的面试题)
Aug 20 #Javascript
You might like
PHP网站备份程序代码分享
2011/06/10 PHP
简单的php新闻发布系统教程
2014/05/09 PHP
php框架CodeIgniter使用redis的方法分析
2018/04/13 PHP
飞鱼(shqlsl) javascript作品集
2006/12/16 Javascript
JMenuTab简单使用说明
2008/03/13 Javascript
基于jQuery图片平滑连续滚动插件
2009/04/27 Javascript
Javascript 获取链接(url)参数的方法[正则与截取字符串]
2010/02/09 Javascript
js创建对象的几种常用方式小结(推荐)
2010/10/24 Javascript
javascript客户端遍历控件与获取父容器对象示例代码
2014/01/06 Javascript
node.js中的Socket.IO使用实例
2014/11/04 Javascript
JavaScript控制listbox列表框的项目上下移动的方法
2015/03/18 Javascript
JavaScript数组迭代器实例分析
2015/06/09 Javascript
Angular.Js之Scope作用域的学习教程
2017/04/27 Javascript
详解vue-router 2.0 常用基础知识点之router.push()
2017/05/10 Javascript
AngularJS的ng-click传参的方法
2017/06/19 Javascript
JS实现网站吸顶条
2020/01/08 Javascript
Python实现过滤单个Android程序日志脚本分享
2015/01/16 Python
Python利用带权重随机数解决抽奖和游戏爆装备问题
2016/06/16 Python
python定时利用QQ邮件发送天气预报的实例
2017/11/17 Python
python决策树之C4.5算法详解
2017/12/20 Python
Win7下Python与Tensorflow-CPU版开发环境的安装与配置过程
2018/01/04 Python
使用python进行波形及频谱绘制的方法
2019/06/17 Python
python基于socket进行端口转发实现后门隐藏的示例
2019/07/25 Python
Python创建文件夹与文件的快捷方法
2020/12/08 Python
使用CSS3 制作一个material-design 风格登录界面实例
2016/12/12 HTML / CSS
AE美国鹰美国官方网站:American Eagle Outfitters
2016/08/22 全球购物
财务会计专业推荐信
2013/11/30 职场文书
企业演讲稿范文
2013/12/28 职场文书
人事专员的岗位职责
2014/03/01 职场文书
青年志愿者先进事迹
2014/05/06 职场文书
投标诚信承诺书
2014/05/26 职场文书
教师自我剖析材料范文
2014/09/30 职场文书
介绍信格式
2015/01/30 职场文书
网络销售员岗位职责
2015/04/11 职场文书
大学生创业计划书
2019/06/24 职场文书
聊聊配置 Nginx 访问与错误日志的问题
2022/05/25 Servers