js在contenteditable="true"文本框光标处插入内容

最新推荐文章于 2024-05-16 10:31:53 发布

金大光

最新推荐文章于 2024-05-16 10:31:53 发布

阅读量7.9k

点赞数 3

分类专栏： JavaScript[0] 文章标签： js JavaScript 光标 div文本框

本文链接：https://blog.csdn.net/qq_17757973/article/details/77453364

版权

JavaScript[0] 专栏收录该内容

34 篇文章 0 订阅

订阅专栏

本文实例讲述了如何在div contenteditable文本框光标处插入内容

function pasteHtmlAtCaret(html) {
    var sel, range;
    if (window.getSelection) {
        sel = window.getSelection();
        if (sel.getRangeAt && sel.rangeCount) {
            range = sel.getRangeAt(0);
            range.deleteContents();
            var el = document.createElement("div");
            el.innerHTML = html;
            var frag = document.createDocumentFragment(), node, lastNode;
            while ( (node = el.firstChild) ) {
                lastNode = frag.appendChild(node);
            };
            range.insertNode(frag);
            if (lastNode) {
                range = range.cloneRange();
                range.setStartAfter(lastNode);
                range.collapse(true);
                sel.removeAllRanges();
                sel.addRange(range);
            };
        };
    } else if (document.selection && document.selection.type != "Control") {
        // IE9以下
        document.selection.createRange().pasteHTML(html);
    };
};