如何将Quill.js应用于已经可编辑的元素？

Question

The problem:

I have to use the Delta and Event features of Quill.js to provide some contextual dropdowns on specific keywords within the Gmail Composer (on gmail.com) in a chrome extension.

The problem is that the Gmail Composer already has a content editable element. When I apply Quill.js to it, I end up with another contenteditable element within the gmail composer element. With a simple backspace the Quill.js editor actually gets deleted and the functionality of quill is pretty much broken in many other ways.

I can't remove the Gmail Composer's editor because then I remove basic Gmail functions like Attachments, Links, Emoticons etc. On the other hand I have to use Quill.js to implement some features.

Example

Here is a simplified example: http://jsfiddle.net/vdaqrsrw/1/ :

When initiating Quill on the #editor it creates the #ql-editor-1 element within the #editor element that already has contenteditable set - so now we have 2 contenteditable elements nested in each other that breaks the toolbar and general functionality of the editable area:

The Question

Is there a way to apply Quill.js to an already content editable area without the nesting problems? Are there any other ways to do it?

Answer 1

不，Quill设计和构建为独立编辑器。