在可编辑div的光标下插入html
function pasteHtmlAtCaret(html, selectPastedContent) {
//参数1为要插入的html
//参数2为boolean 是否选中插入的html 默认为false
var sel, range;
if (window.getSelection) {
// IE9 and non-IE
sel = window.getSelection();
if (sel.getRangeAt && sel.rangeCount) {
range = sel.getRangeAt(0);
range.deleteContents();
// Range.createContextualFragment() would be useful here but is
// only relatively recently standardized and is not supported in
// some browsers (IE9, for one)
var el = document.createElement("div");
el.innerHTML = html;
var frag = document.createDocumentFragment(), node, lastNode;
while ( (node = el.firstChild) ) {
lastNode = frag.appendChild(node);
}
var firstNode = frag.firstChild;
range.insertNode(frag);
// Preserve the selection
if (lastNode) {
range = range.cloneRange();
range.setStartAfter(lastNode);
if (selectPastedContent) {
range.setStartBefore(firstNode);
} else {
range.collapse(true);
}
sel.removeAllRanges();
sel.addRange(range);
}
}
} else if ( (sel = document.selection) && sel.type != "Control") {
// IE < 9
var originalRange = sel.createRange();
originalRange.collapse(true);
sel.createRange().pasteHTML(html);
if (selectPastedContent) {
range = sel.createRange();
range.setEndPoint("StartToStart", originalRange);
range.select();
}
}
}
在可编辑div的光标下插入html的更多相关文章
- 可编辑div,将光标定位到文本之后
类似qq回复一样,某人评论之后,在对评论进行回复之后,将光标定位到文本之后: function set_focus() { el=document.getElementById('guestbook_ ...
- 可编辑DIV (contenteditable="true") 在鼠标光标处插入图片或者文字
近期需开发一个DIV做的编辑器,插入表情图片可直接预览效果,仔细参考了下百度贴吧的过滤粘贴过来文件的THML代码,自己整理了下.写出来只是和大家分享下,我自己也不大懂,经过努力,幸好搞定. 蛋疼的事情 ...
- div 可编辑--获取光标位置插入元素
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Language" ...
- 2017-02-20 可编辑div中如何在光标位置添加内容
之前做了一个可编辑div需要在里面插入内容,搜了好多代码,就这个能实现我的功能,记录一下,以备以后用 <!DOCTYPE HTML> <html> <head> & ...
- 可编辑DIV与移动端软键盘兼容性问题汇总
此文复现的所有兼容性问题均为以下情况: 1. 腾讯X5内核 2. 全屏webview 问题如下: 1. IOS12 中软键盘弹出导致页面顶部截断,并且无法恢复. 解决方法:添加交互事件,调用本地方法, ...
- js在一个可编辑的div光标处插入图片或者文本(兼容ie,火狐等浏览器)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 可编辑div中包含子元素时获取光标位置不准确的问题
前言: 高亮显示输入框中的关键字符,这就必须得用到可编辑div(或其他标签)元素了,这时我们需要获取光标的位置,以便插入字符. 正文: 正常情况下获取光标位置,代码如下: function getPo ...
- js之向div contenteditable光标位置添加字符
js之向div contenteditable光标位置添加字符 原理: 在HTML里面,光标是一个对象,光标对象是只有当你选中某个元素的时候才会出现的. 当我们去点击一个输入框的时候,实际上它会产生 ...
- textarea光标处插入文字
(function($) { $.fn.extend({ //myField 对象元素 myValue 插入值 insertAtCursor: function(myField,myValue) { ...
随机推荐
- 基于Linux下catalog方式的 Oracle 备份策略(RMAN)
--********************************** -- 基于Linux下 Oracle 备份策略(RMAN) --******************************* ...
- 面试7家,收到5个offer,我的Python就业经验总结 !
*---------------------------------------人生处处有惊喜,背后却是无尽的辛酸苦辣. Python找工作并不容易,老表面试了很多企业,总结了些宝贵经验! 一周转 ...
- eplan图框制作
1. 首先,新建一个原理图项目 2. 新建图框.选择“工具”→“主数据”→“图框”→“新建” 在“文件名”中输入文件名,保存. 3.添加新建图框属性选项.选中“新建符号*”,添加选项 4. 设置图框的 ...
- Linux系统编程之事件驱动
通常,我们写服务器处理模型的程序时,有以下几种模型:(1)每收到一个请求,创建一个新的进程,来处理该请求:(2)每收到一个请求,创建一个新的线程,来处理该请求:(3)每收到一个请求,放入一个事件列表, ...
- MySQL--事务操作
/*事务:由一个或一组sql命令组成的事件,要么全部执行,要么全部不执行 查看事务隔离级别:select @@tx_isoolation 修改事务隔离级别:set session transactio ...
- git常用命令值stash
git stash(git储藏)可用于以下情形: 发现有一个类是多余的,想删掉它又担心以后需要查看它的代码,想保存它但又不想增加一个脏的提交.这时就可以考虑git stash. 使用git的时候,我们 ...
- DELPHI中build和compile有什么区别?
Build编译全部与工程相关联的文件,可包括版本信息及工程中的预编译变量等:Compile只重新编译更改过的相关单元及文件,调试是Compile就可以了,若是发布,则Build为好 BUILD =C ...
- nginx 提示the "ssl" directive is deprecated, use the "listen ... ssl" directive instead
该问题是由于新版nginx采用新的方式进行监听https请求了 解决方式 在listen中改为 listen 443 ssl; 删除ssl配置 # ssl on; 完美解决: 解决完成前后的配置如下 ...
- Linux-系统调用理解
系统调用即为Linux内核中设置的一组用于实现各种系统功能的子程序,操作系统通过系统调用为运行在其上的进程提供服务. 由于进程一般不能访问内核所占内存空间以及调用内核函数,为了与用户态进程进行交互,内 ...
- Linux uniq 命令
Linux uniq 命令 Linux 命令大全 Linux uniq 命令用于检查及删除文本文件中重复出现的行列,一般与 sort 命令结合使用. uniq 可检查文本文件中重复出现的行列. 语法 ...