如何在summernote编辑器中将div附加到div

时间:2017-05-11 20:20:30

标签: javascript summernote

所以我有这个代码,如果它不在那里,就会在文档中插入一个iframe和一个链接,如果它在那里只是一个链接。问题是这需要在自定义div中,因此结构如下所示:

<div class="page-reference">
  <iframe src="http://www.myiframe.com/1" height="400" id="pageReferenceIframe"></iframe>
  <div class="">
    <a href="http://www.myiframe.com/1" class="page-reference-link">ref1</a>
  </div>
  <div class="page-reference-active">
    <a href="http://www.myiframe.com/2" class="page-reference-link">ref2</a>
  </div>
  <div>
    <a href="http://www.myiframe.com/3" class="page-reference-link">ref3</a>
  </div>
</div>

我需要使用summernote编辑器实现这一点,以便管理员可以创建一个新链接,并在单击链接时更改iframe的src,该部分有效。什么不起作用是这样的:

addReference(reference) {
    let hasReferences = /class=\"page-reference\"/.test(this.currentPage().text);
    if (hasReferences) {
        let pageReference = document.getElementsByClassName('page-reference')[0];
        pageReference.appendChild(this.createPageReferenceLink(reference));
    } else {
        let div = document.createElement('div');
        div.classList = 'page-reference';
        let iframe = this.createIframe({ site: reference.site, height: 400, width: 80 });
        iframe.id = 'pageReferenceIframe';
        div.appendChild(iframe);
        let link = this.createPageReferenceLink(reference);
        link.classList = 'page-reference-active';
        div.appendChild(link);

        this.insertSummernoteNode(div);
    }
}

此代码适用于每个页面加载一次,然后在页面再次加载之前不起作用。我检查了代码是通过在每一行上放置一个调试器并且它们被触发后来执行的,但是问题是pageReference.appendChild(this.createPageReferenceLink(reference));没有在第一个之后的任何尝试上追加创建的元素。我不认为我可以使用summernote方法insertNode,因为它似乎无法插入特定位置。我坚持这一点,任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:0)

想出来,确保没有夏令营编辑器在页面上显示的计算html,或者可能会混淆它应该附加到哪个div