使 contenteditable div 中的 span 不可编辑

【问题标题】：make a span within a contenteditable div uneditable使 contenteditable div 中的 span 不可编辑
【发布时间】：2013-09-26 16:29:18
【问题描述】：

我有一个 contenteditable div，其中包含几个带有类 dontEdit 的 span。有没有办法可以使跨度不可编辑，而 div 的其余部分保持可编辑。

<div contenteditable=true>
    editable1 <span class="dontEdit">uneditable1</span> editable2
</div>

请看这里的小提琴：http://jsfiddle.net/LZpag/

【问题讨论】：

标签： contenteditable html

【解决方案1】：

将contenteditable="false" 添加到每个<span> 元素。如果需要动态执行，可以使用 JavaScript 中的contentEditable 属性。请注意，以下内容在 IE document.getElementsByClassName()，但如有必要，可以轻松解决：

var spans = document.getElementsByClassName("dontEdit");
for (var i = 0, len = spans.length; i < len; ++i) {
    spans[i].contentEditable = "false";
}

【讨论】：