1

我正在使用 CKEditor 插入引用标记（脚注）。我编写了一个 CKEditor 插件，允许用户单击 CKEditor 实例中的按钮并输入新的引用或选择现有的引用。标记是使用 jQuery 构建的：

    // see http://www.w3.org/TR/html5/common-idioms.html#footnotes
    var $cite = $("<sup>").append($("<a>").attr("href", "#").attr("data-citationid", citationId).html("[" + citationId + "]"));
    editor.insertHtml($cite.get(0).outerHTML);

wheredata-citationid引用数据库中引文的 id。问题是 Chrome (23.0.1271.97 m) 中插入的标记不同。

Firefox (17.0.1) 和 IE (9.0.8112.16421) 插入所需的

<sup><a data-citationid="26" href="#">[26]</a></sup>

但 Chrome 会去除<sup>标签并插入

<a data-citationid="26" href="#" style="vertical-align: super;">[26]</a>

我的问题是：

  • 我可以构建标记以使其始终按需要呈现吗？
  • 浏览器或 CKEditor 是否更改了标记？
4

2 回答 2

1

.outerHTML 是原生 JS 而不是 jquery，它的实现可能会有所不同。尝试包装它并.html()像这样调用包装器

$cite.clone().wrap('<div>').parent().html();
于 2012-12-30T16:23:57.930 回答
1

insertHTML由于浏览器不一致，不应用于插入 HTML。插入 HTML的正确方法是创建一个元素并调用insertElement.

这对我有用：

    var cite = "<sup><a href=\"#\" data-citationid=\"" + citationId + "\">[" + citationId + "]</a></sup>";
    var element = CKEDITOR.dom.element.createFromHtml(cite, editorInstance.document);
    editorInstance.insertElement(element);
于 2013-01-01T22:20:47.847 回答