问防止在可编辑内容的html中插入文本
EN

Stack Overflow用户

提问于 2018-06-14 03:53:57

回答 2查看 359关注 0票数 1

我有一个带有contenteditable的div，里面有一个链接：

<div contenteditable>
  <a id="a">[$special.value$]</a>
</div>

如果用户单击末尾的字段并开始键入，则新文本将插入到<a>中，而不是插入到它之后。

<div contenteditable>
  <a id="a">[$special.value$] new text added here</a> instead of here
</div>

如何确保在<a>之外添加新文本

我曾尝试在<a>上添加contenteditable="false"，但这添加了许多其他怪癖。

现在，我能想到的最好的办法就是在链接之前和之后使用&zwnj; -这可以防止文本被添加到<a>中，但它会使光标移动有点奇怪(你必须额外的向左/右移动一段时间)

div[contenteditable] {
  border: 1px solid #aaa;
}

a {
  color: red;
}

Normal
<div contenteditable>
  <a id="a">[$special.value$]</a>
</div>

With zwnj
<div contenteditable>
  <a id="a">[$special.value$]</a>&zwnj;
</div>

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/50845230

复制

相似问题

问防止在可编辑内容的html中插入文本EN