在主轴编辑器中的特定索引中插入链接

时间:2016-10-09 23:18:33

标签: quill

我正在尝试在主播编辑器中的特定位置插入锚文本。

 var fullEditor = new Quill('#m_wiki_textarea', {
              modules: {
                'toolbar': { container: '#toolbar' },
                 'image-tooltip': true,
                'link-tooltip': true
              },
              theme: 'snow'
            });
            fullEditor.setHTML(m_wiki_current);
           //added by pavneet
            console.log("added by pavneet");

          $(document).keypress("q",function(e) {
          if(e.ctrlKey)
         {
           var range = fullEditor.getSelection();
           var index = range.start;
                console.log(range);
            console.log(index);
 fullEditor.clipboard.dangerouslyPasteHTML(index,'<a class="wiki_link_details" data-l_id="3698">Learn more from this resource</a>');
         }`

但我收到此错误,无法读取未定义的属性'dangerouslyPasteHTML'。但我已经定义了编辑器。

有没有办法在主播编辑器中插入链接?

2 个答案:

答案 0 :(得分:2)

使用updateContents

实施例:

&#13;
&#13;
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'
});

quill.insertText(0, "abc ");

var delta = {
  ops: [
    {retain: 4},
    {insert: "Learn more from this resource", attributes: {link: "http://wikipedia.org"}}
  ]
};
quill.updateContents(delta);
&#13;
#editor-container {
  height: 375px;
}
&#13;
<script src="//cdn.quilljs.com/1.0.6/quill.js"></script>
<link href="//cdn.quilljs.com/1.0.6/quill.snow.css" rel="stylesheet"/>
<div id="editor-container"></div>
&#13;
&#13;
&#13;

答案 1 :(得分:1)

是的,您应该插入一个文本,然后选择它并将其设为链接 (demo):

function addLink(quill, index, text, url) {
  quill.insertText(index, text, 'user');
  quill.setSelection(index, text.length);
  quill.theme.tooltip.edit('link', url);
  quill.theme.tooltip.save();
}