javascript - 尝试用包含在 span 元素中的相同单词替换单词

Question

我有一个contenteditable div。我正在尝试寻找“设计”一词并将其包装在 span 元素中。

HTML:

<div id="text"></div>

JavaScript:

$("#text").prop("contenteditable", true);
var string = $("#text")[0].innerHTML;
$("#text").innerHTML = string.replace("design", "<span>design</span>");

这行不通。我的第一个猜测是，这是因为脚本运行一次，所以当我输入“设计”时，它没有捕获它。因此，我尝试将其放入 setInterval 中，但这也不起作用。 JSFiddle

任何帮助将不胜感激。

Answer 1

$("#text").prop("contenteditable", true).keypress(function(e){
    $(this).html(function(i,html){return html.replace(/<span>design</span>/g,"design").replace(/design/g, "<span>design</span>")});
});

我没有测试，但希望它能起作用。