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之排序组件的深入解析
Jun 19 Javascript
node.js中的fs.writeFile方法使用说明
Dec 14 Javascript
js实现的牛顿摆效果
Mar 31 Javascript
JavaScript实现简单的数字倒计时
May 15 Javascript
Bootstrap 附加导航(Affix)插件实例详解
Jun 01 Javascript
JS重载实现方法分析
Dec 16 Javascript
详解angularjs获取元素以及angular.element()用法
Jul 25 Javascript
JS散列表碰撞处理、开链法、HashTable散列示例
Feb 08 Javascript
原生js实现针对Dom节点的CRUD操作示例
Aug 26 Javascript
vue.js实现图书管理功能
Sep 24 Javascript
vue随机验证码组件的封装实现
Feb 19 Javascript
详解JavaScript中的执行上下文及调用堆栈
Apr 29 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中创建并处理图象
2006/10/09 PHP
php中关于socket的系列函数总结
2015/05/18 PHP
PHP图形计数器程序显示网站用户浏览量
2016/07/20 PHP
thinkphp 抓取网站的内容并且保存到本地的实例详解
2017/08/25 PHP
laravel 实现关闭CSRF(全部关闭、部分关闭)
2019/10/21 PHP
laravel框架数据库操作、查询构建器、Eloquent ORM操作实例分析
2019/12/20 PHP
YUI 读码日记之 YAHOO.lang.is*
2008/03/22 Javascript
超级酷和最实用的jQuery实例收集(20个)
2010/04/21 Javascript
Javascript 中的 &amp;&amp; 和 || 使用小结
2010/04/25 Javascript
jQuery提交表单ajax查询实例代码
2012/10/07 Javascript
基于jQuery实现带动画效果超炫酷的弹出对话框(附源码下载)
2016/02/22 Javascript
node.js从数据库获取数据
2016/05/08 Javascript
jQuery+ajax读取并解析XML文件的方法
2016/09/09 Javascript
AngularJs验证重复密码的方法(两种)
2016/11/25 Javascript
JavaScript如何实现图片懒加载(lazyload) 提高用户体验(增强版)
2016/11/30 Javascript
js Canvas绘制圆形时钟教程
2017/02/06 Javascript
BootStrap入门学习第一篇
2017/08/28 Javascript
seajs中最常用的7个功能、配置示例
2017/10/10 Javascript
javascript设计模式之装饰者模式
2020/01/30 Javascript
bootstrap-paginator服务器端分页使用方法详解
2020/02/13 Javascript
Windows下Python2与Python3两个版本共存的方法详解
2017/02/12 Python
python3中int(整型)的使用教程
2017/03/23 Python
Django实现组合搜索的方法示例
2018/01/23 Python
python奇偶行分开存储实现代码
2018/03/19 Python
对numpy数据写入文件的方法讲解
2018/07/09 Python
基于python plotly交互式图表大全
2019/12/07 Python
Python3 把一个列表按指定数目分成多个列表的方式
2019/12/25 Python
python 非线性规划方式(scipy.optimize.minimize)
2020/02/11 Python
浅谈TensorFlow中读取图像数据的三种方式
2020/06/30 Python
scrapy结合selenium解析动态页面的实现
2020/09/28 Python
法国体育用品商店:GO Sport
2019/10/23 全球购物
Erwin Müller穆勒家居瑞士官网:您整个家庭的邮购公司
2019/12/28 全球购物
大学生的四年学习自我评价
2013/12/13 职场文书
旷课检讨书1000字
2014/02/14 职场文书
高中军训感言500字
2014/02/24 职场文书
爬山的活动方案
2014/08/16 职场文书