使用JS在textarea在光标处插入内容
为什么80%的码农都做不了架构师?>>>
// 在光标处插入字符串// myField 文本框对象// myValue 要插入的值function insertAtCursor(myField, myValue) {//IE supportif (document.selection) {myField.focus();sel = document.selection.createRange();sel.text = myValue;sel.select();}//MOZILLA/NETSCAPE supportelse if (myField.selectionStart || myField.selectionStart == '0') {var startPos = myField.selectionStart;var endPos = myField.selectionEnd;// save scrollTop before insertvar restoreTop = myField.scrollTop;myField.value = myField.value.substring(0, startPos) + myValue + myField.value.substring(endPos, myField.value.length);if (restoreTop > 0){// restore previous scrollTopmyField.scrollTop = restoreTop;}myField.focus();myField.selectionStart = startPos + myValue.length;myField.selectionEnd = startPos + myValue.length;} else {myField.value += myValue;myField.focus();}}function insertText() {var obj = document.getElementById("文本框");var str = "[#$%$#]插入的内容";if (document.selection) {obj.focus();var sel = document.selection.createRange();sel.text = str;} else if (typeof obj.selectionStart === 'number' && typeof obj.selectionEnd === 'number') {var startPos = obj.selectionStart;var endPos = obj.selectionEnd;var tmpStr = obj.value;obj.value = tmpStr.substring(0, startPos) + str + tmpStr.substring(endPos, tmpStr.length);} else {obj.value += str;}}//Jquery光标处插入文本$(document).ready(function () {$("#btnInsert").click(function () {var obj = $("#txtquestion").get(0);var str = "[#$%$#]";if (document.selection) {obj.focus();var sel = document.selection.createRange();sel.text = str;} else if (typeof obj.selectionStart === 'number' && typeof obj.selectionEnd === 'number') {var startPos = obj.selectionStart;var endPos = obj.selectionEnd;var tmpStr = obj.value;obj.value = tmpStr.substring(0, startPos) + str + tmpStr.substring(endPos, tmpStr.length);} else {obj.value += str;});});
转载于:https://my.oschina.net/jsan/blog/41437
使用JS在textarea在光标处插入内容相关推荐
- contentEditable,window.getSelection详解---可编辑div,容器,设置/获取光标位置,光标处插入内容及光标的操作
这周碰到一个东西,contentEditable ,它是用来指定一个元素是否是可编辑的,这也是富文本编辑器实现的底层支持,网上关于这部分东西的资料比较少或者不全,所以我来整理下关于这个属性,和可编辑区 ...
- html input或textarea 如何在光标处插入内容
在大部分应用程序中,Tab是用来切换焦点的,浏览器也不例外.可是如果想在input或textarea输入Tab就很困难.这里就教大家用jQuery写一个允许输入Tab(四个空格)的方法. $(func ...
- js在PageOffice打开的Word文档光标处插入书签
在使用Word时,如果内容过多有时为了快速定位到内容的某一处或某一部分怎会在该处添加书签.Word中的书签可以通过工具栏手动添加或删除,也可以通过后台程序结合JS函数在当前光标处插入书签,或根据书签名 ...
- react/antd实现textarea获取光标位置在光标处插入文字
react/antd实现textarea获取光标位置在光标处插入文字 1.首先将textarea对象通过refs存起来 <TextArearef={(input) => this.cont ...
- html文本框光标位置,html的文本框显示光标 如何在htmlText文本框光标处插入字符...
HTML 如何设置文本框中光标位置和光标居中 我写样式,把文本框的宽度加大了.但是光标位置在上面. html怎么让文本框的光标出现在内容最后 HTML如何在打开页面时将光标定位在某个文本框 HTML5 ...
- 解决从光标处插入图片光标消失的问题
最近在做一个富文本编辑器,当鼠标单击事件发生在编辑区域外以后,光标就会消失,那么execCommand()方法就不能在编辑器处执行. 此时需要记录下光标消失的位置,一下几篇博文帮助非常大,记录下,以便 ...
- java文本框光标后添加图片_由编辑器从光标处插入图片(失去焦点后仍然可以在原位置插入)实现的富文本编辑器...
大家都知道,如果只是大概的实现一个简单的富文本编辑器,直接用execCommand就可以了,虽然不同浏览器对execCommand命令的反应不一样,最后效果是差不多的.当然,如果要严谨的,用像uedi ...
- vue 怎么在字符串中指定位置插入字符_vue项目中在可编辑div光标位置插入内容的实现代码...
vue项目中在可编辑div光标位置插入内容 html: @dragstart="dragStart($event, item.labelName)" draggable='true ...
- jQuery 输入框 在光标位置插入内容, 并选中
// //使用方法 //$(文本域选择器).insertContent("插入的内容"); //$(文本域选择器).insertContent("插入的内容", ...
最新文章
- 闲话WPF之二四(WPF中的ControlTemplate [2])
- Spring Cloud Stream整合RabbitMQ
- VTK:可视化之Camera
- 系统建模、分析、仿真和验证软件工具ModelCodoer
- post 下载文件 (excel)
- linux运维、架构之路-Kubernetes集群部署TLS双向认证
- 编程基本功训练:流程图画法及练�
- Mysql 报错:Unknown collation: ‘utf8mb4_0900_ai_ci‘
- 两种前端在线json编辑器方案(无法解决number精度丢失问题)
- 赫/哈/霍 夫曼(Huffman)编码 游程编码
- 【Javascript】用 js 写一个模板引擎
- DongDong认亲戚 来源:牛客网
- [Chatter] 架构设计是做甚么
- eclipse设置工作空间的默认编码和设置项目的编码
- android app 隐藏应用,教你一招,隐藏我们手机中的APP应用!
- PSO粒子群算法调节PID控制器参数
- Acwing-280-陪审团(背包dp?)
- 计算机技术交流群QQ:69706169,电脑维护故障排除,网络,通信,交换,电子等欢迎加入!...
- Golang源码探究 —— 网络轮询器netpoller
- Windows PC软件反编译逆向破解