javascript - 如何防止在javascript中按退格键时光标返回？

Question

请考虑以下 html。

<div id="container" contenteditable="true">
<p>This is a paragraph <span class="test">'this text is inside the span'</span> 
        This is another paragraph afer the span tag inside this p tag
    </p> </div>

如你所见，p和span标签在浏览器中是可编辑的，这意味着我们可以在浏览器中编写它。现在我的问题是关于 p 标签内的跨度。那么任何人都可以解释一下如果光标(在浏览器中输入此范围时)位于范围标签之后，即结束范围标签之后，则退格键不应该起作用。

更简单的是，一旦光标移出跨度，退格键不应再次将其移动到跨度。请帮忙提供一个简单的 JavaScript 示例。

Answer 1

如果您可以稍微更改 DOM，则无需 Javascript 即可完成此操作。

看到 Fiddle

<div id="container">
    <span  contenteditable="true">This is a paragraph</span>
    <span class="test" contenteditable="true">'this text is inside the span'</span>
    <span contenteditable="true">This is another paragraph afer the span tag inside this tag</span>
</div>

CSS只是为了显示不同的span

.test
{
    background-color: red;
}