英文:
Make some keywords not removable in content editable div
问题
<!-- 开始片段: js 隐藏: false 控制台: true babel: false -->
<!-- 语言: lang-css -->
span[contenteditable="false"] {
color: red;
}
<!-- 语言: lang-html -->
<div contenteditable="true" id="editableDiv">
可编辑的内容 <span contenteditable="false">不可编辑的内容</span> 可编辑的内容
</div>
<!-- 结束片段 -->
英文:
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-css -->
span[contenteditable="false"] {
color: red;
}
<!-- language: lang-html -->
<div contenteditable="true" id="editableDiv">
Editable Span <span contenteditable="false">Not Editable Span</span> Editable Span
</div>
<!-- end snippet -->
Looking at this question, I am able to make some keywords not editable in content editable. However, when I go on editable part of the span and I press backspace or del button, I can remove the not editable span. I tried with some JS but I did not succeed to make it work. So the question is different because I would like to avoid to be able to delete the not editable span
答案1
得分: 1
我刚刚发现了contenteditable代码。也许你的意思是这样的：
<!-- 开始代码段：js 隐藏：false 控制台：true Babel：false -->
<!-- 语言：lang-css -->
span[contenteditable="false"] {
color: red;
}
span[contenteditable="true"] {
outline: none;
}
<!-- 语言：lang-html -->
<div id="editableDiv">
<span contenteditable="true">可编辑的文本</span>
<span contenteditable="false">不可编辑的文本</span>
<span contenteditable="true">可编辑的文本</span>
</div>
<!-- 结束代码段 -->
英文:
I just found out there is contenteditable code. maybe what you mean is like this
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-css -->
span[contenteditable="false"] {
color: red;
}
span[contenteditable="true"] {
outline: none
}
<!-- language: lang-html -->
<div id="editableDiv">
<span contenteditable="true">Editable Span</span>
<span contenteditable="false">Not Editable Span</span>
<span contenteditable="true">Editable Span</span>
</div>
<!-- end snippet -->
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论