代码示例:
const Embed = Quill.import('blots/embed')
Quill.register(class extends Embed {
static create (key) {
let node = super.create()
node.setAttribute('data-key', key)
node.innerHTML = `#${key}`
return node
}
static value (node) {
return node.dataset.key
}
static blotName = 'customEmbed'
static className = 'customEmbed'
static tagName = 'span'
})
const quill = new Quill('#editor', {
placeholder: 'Compose an epic...',
theme: 'snow' // or 'bubble'
})
document.getElementById('insertEmbded').onclick = () => {
quill.insertEmbed(0, 'customEmbed', 'insertedEmbed')
}
document.getElementById('sidebar')
.querySelectorAll('.customEmbed')
.forEach(e => {
e.ondragstart = ev => {
ev.dropEffect = 'copy'
ev.effectAllowed = 'copy'
ev.dataTransfer.setData('text', ev.target.innerHTML)
ev.dataTransfer.setData('html', `${ev.target.innerHTML}`)
}
e.setAttribute('draggable', 'true')
})
如果我不设置文本数据传输,则drop只是“disabled/ignored”,而html数据传输则完全忽略。
提前感谢您的进一步回复。