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);

ここdata-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

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 に答える
1

.outerHTML は jquery ではなくネイティブ JS であり、その実装はさまざまです。.html()それをラップして、このようにラッパーを呼び出してみてください

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