我想创建一个可以样式化的自定义嵌入格式，但是其文本无法更改。我的用例与标签用例非常相似。我希望有一个外部按钮，它将在编辑器上的当前选定范围内添加一个标签。但是在执行此操作之后，我希望主题标签表现为“块”，以便用户无法前往那里并更改其文本。
我能做到这一点的唯一方法是说格式的节点为contenteditable = false，但是由于这种方法存在一些问题，我不确定自己的方法是否正确，主要是：
如果主题标签是编辑器上的最后一件事，则我无法移动它（带有箭头或光标），请双击它以选择整个主题（而不是单个单词）（用于样式设置）。如果光标位于主题标签的紧后面，按下右键，文字将写在主题标签中。您可以在尝试此操作时检查我制作的代码笔：
Quill.import('blots/embed');
class QuillHashtag extends Embed {
static create(value) {
let node = super.create(value);
node.innerHTML = `<span contenteditable=false>#${value}</span>`;
return node;
}
}
QuillHashtag.blotName = 'hashtag';
QuillHashtag.className = 'quill-hashtag';
QuillHashtag.tagName = 'span';
这是完整的codepen：http ://codepen.io/emanuelbsilva/pen/Zpmmzv
如果你们能给我有关如何完成此操作的任何提示，我将很高兴。
谢谢。
您需要做的就是在主跨度上将contenteditable属性设置为false。当前，您正在嵌套跨度上执行此操作。
node.setAttribute('contenteditable', false);
我修改了您帖子中的主题标签代码并应用了更改。
var Embed = Quill.import('blots/embed');
class QuillHashtag extends Embed {
static create(value) {
let node = super.create(value);
node.setAttribute('contenteditable', false);
node.innerHTML = value;
return node;
}
}
QuillHashtag.blotName = 'hashtag';
QuillHashtag.className = 'quill-hashtag';
QuillHashtag.tagName = 'span';
Quill.register({
'formats/hashtag': QuillHashtag
});
var quill = new Quill('#editor-container', {
modules: {
toolbar: [
[{
header: [1, 2, false]
}],
['bold', 'italic', 'underline'],
['image', 'code-block']
]
},
placeholder: 'Compose an epic...',
theme: 'snow' // or 'bubble'
});
document.getElementById('b').addEventListener('click', () => {
var range = quill.getSelection();
if (range) {
var hashtag = prompt("Select hashtag", "foobar");
quill.insertEmbed(range.index, 'hashtag', hashtag);
}
});#editor-container {
height: 375px;
}
.quill-hashtag {
background-color: lightgray;
}<link href="https://cdnjs.cloudflare.com/ajax/libs/quill/1.3.1/quill.snow.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/quill/1.3.1/quill.min.js"></script>
<div id="editor-container"></div>
<button id="b">add hashtag</button>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句