js在光标处插入内容

Posted 刘兵

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js在光标处插入内容相关的知识,希望对你有一定的参考价值。

//场景一 简易的页面可以这样写
var range = window.getSelection().getRangeAt(0);
range.insertNode(document.createTextNode("插入的值"));

 

//场景二 如果需要插入html文本,考虑到在弹出框中插入的场景,因此修改为如下方式
var range;//记录光标位置对象
var node = window.getSelection().anchorNode;
// 这里判断是做是否有光标判断,因为弹出框默认是没有的
if(node!=null){
range = window.getSelection().getRangeAt(0);// 获取光标起始位置
}else{
  range = undefined;
}
var doc = document.createElement("img");//创建节点对象
doc.setAttribute("src", imgSrc);//给节点对象添加属性
range.insertNode(doc);// 在光标位置插入该对象














以上是关于js在光标处插入内容的主要内容,如果未能解决你的问题,请参考以下文章

重要重要如何在div是contentEditable=true的里面获取光标的位置,并在光标位置处插入内容。焦点位置插入指定内容

DIV 粘贴插入文本或者其他元素后,移动光标到最新处

Quill 编辑器 - 在 quill 编辑器中的光标处插入内容

vim常用操作

JQ在光标处插入文字

在textarea和input光标处插入内容,支持ie