js实现在文本框光标处添加字符的方法介绍


Posted in Javascript onNovember 24, 2012
<script language="javascript" type="text/javascript"> 
function Button4_onclick(obj) { 
obj.focus(); 
var rng=document.selection.createRange(); 
rng.setEndPoint("StartToStart",obj.createTextRange()); 
var eng=document.selection.createRange(); 
eng.setEndPoint("EndToEnd",obj.createTextRange()); 
var kone = document.getElementByIdx("Text1"); 
kone.value=rng.text + "插入字符" + eng.text; 
} 
</script> 
<input id="Text1" type="text" value="1235467890"/> 
<input id="Button4" type="button" 
value="button" onclick="return Button4_onclick(Text1)" />

<%@ Page Language="C#" AutoEventWireup="true" AspCompat="true" CodeBehind="WebForm1.aspx.cs" 
Inherits="SJLERP.WebForm1" %> 
<!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"> 
<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);" >例子例子例 Forget Never 子例子例子 asp.net </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> 
</html>
Javascript 相关文章推荐
jquery.alert 弹出式复选框实现代码
Jun 15 Javascript
JavaScript 常用函数
Dec 30 Javascript
两个比较有用的Javascript工具函数代码
Feb 17 Javascript
菜鸟学习JavaScript小实验之函数引用
Nov 17 Javascript
js调用后台servlet方法实例
Jun 09 Javascript
js校验表单后提交表单的三种方法总结
Feb 28 Javascript
使用vue实现点击按钮滑出面板的实现代码
Jan 10 Javascript
JSONP基础知识详解
Mar 19 Javascript
JavaScript 函数的定义-调用、注意事项
Apr 16 Javascript
jquery实现放大镜简洁代码(推荐)
Jun 08 jQuery
解决vue-cli中stylus无法使用的问题方法
Jun 19 Javascript
微信小程序开发问题之wx.previewImage
Dec 25 Javascript
js获取TreeView控件选中节点的Text和Value值的方法
Nov 24 #Javascript
js 连接数据库如何操作数据库中的数据
Nov 23 #Javascript
js 如何实现对数据库的增删改查
Nov 23 #Javascript
Js如何判断客户端是PC还是手持设备简单分析
Nov 22 #Javascript
IE下使用cloneNode注意事项分享
Nov 22 #Javascript
jquery remove方法应用详解
Nov 22 #Javascript
FusionCharts图表显示双Y轴双(多)曲线
Nov 22 #Javascript
You might like
PHP使用数组依次替换字符串中匹配项
2016/01/08 PHP
详解Yii2.0使用AR联表查询实例
2017/06/16 PHP
JavaScript 函数参数是传值(byVal)还是传址(byRef) 分享
2013/07/02 Javascript
Bootstrap每天必学之缩略图与警示窗
2015/11/29 Javascript
Javascript原型链的原理详解
2016/01/05 Javascript
浅析jQuery 遍历函数,javascript中的each遍历
2016/05/25 Javascript
浅谈jquery采用attr修改form表单enctype不起作用的问题
2016/11/25 Javascript
微信小程序实战之运维小项目
2017/01/17 Javascript
JQuery查找子元素find()和遍历集合each的方法总结
2017/03/07 Javascript
jQuery导航条固定定位效果实例代码
2017/05/26 jQuery
Vue.js学习记录之在元素与template中使用v-if指令实例
2017/06/27 Javascript
在Vue中使用Compass的方法
2018/03/02 Javascript
基于datepicker定义自己的angular时间组件的示例
2018/03/14 Javascript
AngularJS ui-router刷新子页面路由的方法
2018/07/23 Javascript
vue 实现websocket发送消息并实时接收消息
2019/12/09 Javascript
vue 使用 vue-pdf 实现pdf在线预览的示例代码
2020/04/26 Javascript
解决Vue项目中tff报错的问题
2020/10/21 Javascript
[01:04]DOTA2上海特锦赛现场采访 FreeAgain遭众解说围攻
2016/03/25 DOTA
Python 获得13位unix时间戳的方法
2017/10/20 Python
Python实战小程序利用matplotlib模块画图代码分享
2017/12/09 Python
[原创]windows下Anaconda的安装与配置正解(Anaconda入门教程)
2018/04/05 Python
Flask使用Pyecharts在单个页面展示多个图表的方法
2019/08/05 Python
vscode 配置 python3开发环境的方法
2019/09/19 Python
mac安装python3后使用pip和pip3的区别说明
2020/09/01 Python
提高python代码运行效率的一些建议
2020/09/29 Python
瑞士领先的网上超市:LeShop.ch
2018/11/14 全球购物
高中生校园生活自我评价
2013/09/19 职场文书
教师自我评价范例
2013/09/24 职场文书
办公室经理岗位职责
2014/01/01 职场文书
遥感技术与仪器求职信
2014/02/22 职场文书
捐款倡议书
2014/04/14 职场文书
奥巴马胜选演讲稿
2014/05/15 职场文书
孔繁森观后感
2015/06/10 职场文书
贷款收入证明格式
2015/06/24 职场文书
小学中队委竞选稿
2015/11/20 职场文书
解决MySQL报“too many connections“错误
2022/04/19 MySQL