当前位置: 首页 > news >正文

js 在光标处插入内容

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
 
<body>
<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=""   οnsubmit=""   method="post"   enctype="text/plain">    
  <p>  
  <textarea   name="tarea"   rows=""   cols=""   style="width:300px;height:120px;" 
  οnselect="setCaret(this);" 
  οnclick="setCaret(this);" 
  οnkeyup="setCaret(this);"   >例子例子例子例子例子</textarea>  
  <br/><br/>  
  <input   type="text"   name="textfield"   style="width:220px;"   value="插入FireFox"/>  
  <br/>  
  <input   type="button"   value="插入" 
  οnclick="insertAtCaret(this.form.tarea,this.form.textfield.value);"/>  
  </p>  
  </form>   
<div id="box" contenteditable="true" style="border:1px solid #ccc; width:300px; height:200px;">sljfldjfldf</div>
 
</body>
</html>

转载于:https://my.oschina.net/u/588516/blog/2413794

相关文章:

  • fastcgi_param 详解
  • dup
  • 常用STL用法总结
  • SQLServer之事务简介
  • 个人笔记:ORACLE大页内存hugepage和SGA、PGA的经验,SGA并不是越大越好
  • JavaScript 类数组对象与 arguments
  • 点击按钮,找不到url
  • WPF模板(一)详细介绍
  • 猿课python第二天
  • 再见了Server对象,拥抱IHostingEnvironment服务对象(.net core)
  • Sublime Text在Ubuntu下无法输入中文的解决方案
  • Oracle11g RAC下ASM 的管理与维护
  • 零基础入门微信小程序开发
  • oracle--数据筛选
  • Flutter widgets——Text/Icon/Button
  • ----------
  • 分享的文章《人生如棋》
  • 2017-08-04 前端日报
  • Android系统模拟器绘制实现概述
  • CAP理论的例子讲解
  • JSONP原理
  • linux学习笔记
  • node和express搭建代理服务器(源码)
  • spring-boot List转Page
  • text-decoration与color属性
  • Vue小说阅读器(仿追书神器)
  • 成为一名优秀的Developer的书单
  • 构建二叉树进行数值数组的去重及优化
  • 前端性能优化——回流与重绘
  • 通信类
  • 责任链模式的两种实现
  • SAP CRM里Lead通过工作流自动创建Opportunity的原理讲解 ...
  • ​2021半年盘点,不想你错过的重磅新书
  • ​比特币大跌的 2 个原因
  • #使用清华镜像源 安装/更新 指定版本tensorflow
  • (11)MSP430F5529 定时器B
  • (23)Linux的软硬连接
  • (Note)C++中的继承方式
  • (pytorch进阶之路)CLIP模型 实现图像多模态检索任务
  • (第61天)多租户架构(CDB/PDB)
  • (附源码)ssm高校实验室 毕业设计 800008
  • (含react-draggable库以及相关BUG如何解决)固定在左上方某盒子内(如按钮)添加可拖动功能,使用react hook语法实现
  • (四)鸿鹄云架构一服务注册中心
  • (算法)前K大的和
  • (五)c52学习之旅-静态数码管
  • .htaccess配置常用技巧
  • .md即markdown文件的基本常用编写语法
  • .Net Framework 4.x 程序到底运行在哪个 CLR 版本之上
  • .net mvc 获取url中controller和action
  • .NET 简介:跨平台、开源、高性能的开发平台
  • .NET开发人员必知的八个网站
  • .net下简单快捷的数值高低位切换
  • .Net下使用 Geb.Video.FFMPEG 操作视频文件
  • .net项目IIS、VS 附加进程调试
  • .net最好用的JSON类Newtonsoft.Json获取多级数据SelectToken