Question

我正在推销我自己的通用wysiwyg编辑器，但我选择了一些文本。我正在使用带有contenteditable设置为true的div来输入文本。问题是我使用<var>标记来突出显示用户应该删除的一些文本，并用自己的语言重写。当单击<var>标记内的文本时，它会按照我的预期突出显示它，但是当您点击退格时它只删除文本而不删除标记（<var>）。如何告诉选择在选择的每一端抓取更多字符，以便它还删除<var>标签？我正在使用以下内容进行选择。

    var range = document.createRange();
    range.selectNodeContents(elem);
    var selection = window.getSelection();
    selection.removeAllRanges();
    selection.addRange(range);

Answer 1

在div的{{1}}事件中放置了功能。

选择了click代码。

使用<var>而不是.selectNode。

浏览器处理它的方式不同。有些会在您输入更多文字时添加.selectNodeContents代码，有些则不会，但这会完全删除<i></i>代码....

<var>

var myDiv = document.getElementById("myDiv");
var elem = document.getElementById("myVar");
myDiv.addEventListener("click", function() {
    var range = document.createRange();
    range.selectNode(elem);
    var selection = window.getSelection();
    selection.removeAllRanges();
    selection.addRange(range);            
});

使用javascript使用createRange选择文本和包含元素

1 个答案: