仅在特定的div中替换选定的HTML

时间:2018-12-21 05:28:09

标签: javascript html getselection

我想选择用户在contenteditable div中选择的HTML。我找到了一些代码来检索所选内容的HTML,但不仅限于div。

我想要做的是复制所选的HTML,在其周围包装标签,然后用它替换所选内容。因此,例如,“测试”将变为“ 测试”。

<div contenteditable="true" class="body" id="bodydiv"></div>

function getSelectionHtml() {
    var html = "";
    if (typeof window.getSelection != "undefined") {
        var sel = window.getSelection();
        if (sel.rangeCount) {
            var container = document.createElement("div");
            for (var i = 0, len = sel.rangeCount; i < len; ++i) {
                container.appendChild(sel.getRangeAt(i).cloneContents());
            }
            html = container.innerHTML;
        }
    } else if (typeof document.selection != "undefined") {
        if (document.selection.type == "Text") {
            html = document.selection.createRange().htmlText;
        }
    }
}

1 个答案:

答案 0 :(得分:0)

HI用于在选定的div中获取内容(文本)我已经创建了一个小代码,您可以检查一下是否适合您:

$(document).ready(function(){
         $(document).bind('mouseup', function(){
         var content =  getSelected();
            content = "<b>"+content+"</b>";
            $('#selected').html(content);
        });
});

    function getSelected(){
        var t;
        if(window.getSelection){
           t = window.getSelection();
           var start = t.focusOffset;
           var end = t.baseOffset;
           t = t.anchorNode.data;
           t = t.slice(start, end);
        }  else if (document.selection) {
             t = document.selection.createRange().text;
        }
        return t;
    }

还有

<div id="selected"></div>

希望这会有所帮助。