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 流畅动画实现原理
Sep 08 Javascript
javascript 使用 NodeList需要注意的问题
Mar 04 Javascript
jquery中选择块并改变属性值的方法
Jul 31 Javascript
js中函数声明与函数表达式
Jun 03 Javascript
jQuery基本过滤选择器用法示例
Sep 09 Javascript
jQuery为DOM动态追加事件的方法
Feb 16 Javascript
全面解析vue中的数据双向绑定
May 10 Javascript
React组件之间的通信的实例代码
Jun 27 Javascript
详解将微信小程序接口Promise化并使用async函数
Aug 05 Javascript
浅谈监听单选框radio改变事件(和layui中单选按钮改变事件)
Sep 10 Javascript
webpack是如何实现模块化加载的方法
Nov 06 Javascript
如何使用CocosCreator对象池
Apr 14 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生成PDF方法详解
2015/01/23 PHP
php上传图片并压缩的实现方法
2015/12/22 PHP
php metaphone()函数及php localeconv() 函数实例解析
2016/05/15 PHP
PHP7使用ODBC连接SQL Server2008 R2数据库示例【基于thinkPHP5.1框架】
2019/05/06 PHP
thinkPHP和onethink微信支付插件分享
2019/08/11 PHP
JS页面延迟执行一些方法(整理)
2013/11/11 Javascript
js读取csv文件并使用json显示出来
2015/01/09 Javascript
JavaScript实现常用二级省市级联下拉列表的方法
2015/03/25 Javascript
【JS+CSS3】实现带预览图幻灯片效果的示例代码
2016/03/17 Javascript
AngularJS 依赖注入详解和简单实例
2016/07/28 Javascript
使用vue编写一个点击数字计时小游戏
2016/08/31 Javascript
JS前向后瞻正则表达式定义与用法示例
2016/12/27 Javascript
jQuery实现6位数字密码输入框
2016/12/29 Javascript
jQuery中table数据的值拷贝和拆分
2017/03/19 Javascript
vue2项目使用sass的示例代码
2017/06/28 Javascript
在移动端使用vue-router和keep-alive的方法示例
2018/12/02 Javascript
python实现根据主机名字获得所有ip地址的方法
2015/06/28 Python
Python在不同目录下导入模块的实现方法
2017/10/27 Python
Django框架模板文件使用及模板文件加载顺序分析
2019/05/23 Python
手把手教你pycharm专业版安装破解教程(linux版)
2019/09/26 Python
Python的缺点和劣势分析
2019/11/19 Python
python如何求数组连续最大和的示例代码
2020/02/04 Python
使用python-cv2实现Harr+Adaboost人脸识别的示例
2020/10/27 Python
HTML5 transform三维立方体实现360无死角三维旋转效果
2014/08/22 HTML / CSS
澳大利亚最大的百货公司:Myer
2018/12/21 全球购物
请问如下代码执行后a和b的值分别是什么
2016/05/05 面试题
技术总监岗位职责
2013/12/05 职场文书
工商管理实习生自我鉴定范文
2013/12/18 职场文书
护理专科毕业自荐信范文
2014/04/21 职场文书
个人自查自纠材料
2014/10/14 职场文书
2014年幼儿园小班工作总结
2014/12/04 职场文书
2014年初三班主任工作总结
2014/12/05 职场文书
检讨书范文500字
2015/01/28 职场文书
2015秋季小学开学寄语
2015/05/27 职场文书
职工宿舍管理制度
2015/08/05 职场文书
2019年让高校“心动”的自荐信
2019/03/25 职场文书