小编gra*_*ion的帖子

描述：我在 Quill Editor 工具栏中创建下拉菜单时遇到问题。任何帮助，将不胜感激。理想情况下，我希望下拉列表显示在工具栏中，并将选择选项文本添加为​​编辑器中的文本。

测试用例： https: //codepen.io/Graphettion/pen/OxezbO

超文本标记语言

<div id="editor-toolbar">
  <select class="ql-emailVars">
    <option value="1">Account Url</option>
    <option value="2">First Name</option>
    <option value="3">Login</option>
    <option value="4">Org Name</option>
    <option value="5">Support Email</option>
  </select>
</div>
<div id="editor"></div>
<div class="text-output"></div>
<div class="html-output"></div>

JS

const quill = new Quill('#editor', {
  modules: {
    toolbar: {
      container: "#editor-toolbar",
        handlers: {
          "emailVars": emailVars
        }
    }
  },
  theme: 'snow'
});

// Add Custom Dropdown to Toolbar
function emailVars(args) {
  const value = args[0];
  const cursorPosition = this.quill.getSelection().index
  this.quill.insertText(cursorPosition, value)
  this.quill.setSelection(cursorPosition + value.length)
} …