0

html5のエディタはtinymce(3.5.8版)エディタを使用しました。今、ビデオとオーディオのタグを追加する機能が必要です。

関数 doTinyMCECleanUp(frm, id) {

var c = frm[id].value;

c = c.replace(/ </source>/gim, '');

c = c.replace(/</source>/gim, '');

// 'html' が 'xhtml' でない場合はコメントアウトします

c = c.replace(/]*)>/gim, '');

frm[id].value = c;

}

tinyMCE.init({

     mode : "textareas",
    theme : "advanced",
    plugins : "visualblocks,inlinepopups,mediahtml5,media",
    theme_advanced_buttons1 : "bold,italic,underline,strikethrough,styleselect,justifyleft,justifycenter,justifyright,justifyfull,|,visualblocks,code,mediahtml5,media",
    theme_advanced_buttons2 : "",
    theme_advanced_buttons3 : "",
    theme_advanced_buttons4 : "",
    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left",
    theme_advanced_statusbar_location : "bottom",
    theme_advanced_resizing : true,
    content_css : "/js/tinymce/examples/css/content.css",
    visualblocks_default_state: true,
    extended_valid_elements : "video[*]",

    // Schema is HTML5 instead of default HTML4
    schema: "html5",

       template_external_list_url : "tinymce/examples/lists/template_list.js",
   external_link_list_url : "tinymce/examples/lists/link_list.js",
   external_image_list_url : "tinymce/examples/lists/image_list.js",
   media_external_list_url : "tinymce/examples/lists/media_list.js",

    // End container block element when pressing enter inside an empty block
    end_container_on_empty_block: true,



    // HTML5 formats
    style_formats : [
            {title : 'h1', block : 'h1'},
            {title : 'h2', block : 'h2'},
            {title : 'h3', block : 'h3'},
            {title : 'h4', block : 'h4'},
            {title : 'h5', block : 'h5'},
            {title : 'h6', block : 'h6'},
            {title : 'p', block : 'p'},
            {title : 'div', block : 'div'},
            {title : 'pre', block : 'pre'},
            {title : 'section', block : 'section', wrapper: true, merge_siblings: false},
            {title : 'article', block : 'article', wrapper: true, merge_siblings: false},
            {title : 'blockquote', block : 'blockquote', wrapper: true},
            {title : 'hgroup', block : 'hgroup', wrapper: true},
            {title : 'aside', block : 'aside', wrapper: true},
            {title : 'figure', block : 'figure', wrapper: true}
    ],

  setup : function(ed) {
  ed.onSubmit.add(function(ed, e) {
     doTinyMCECleanUp(e.target, ed.id);
  });

}、

});

2つのプラグインmediahtml5とmediaで色々試しました。

メディアプラグインを使用する場合。ビデオ タグを追加すると、ビデオ タグ付きの flashobject が挿入されます。また、コンテンツを更新すると、ビデオタグが消えます。HTMLソースエディタのどこにも表示されません。フラッシュ オブジェクト ソースしか表示されません。

mediahtml5 プラグインを使用すると、ビデオをエディターに追加できますが、html ビュー ソース エディターで見ることができません。

誰でも私を助けてください。

4

2 に答える 2

0

'extend_valid_elements'を小さなmceの初期化に追加します。例えば：

$('#my_textarea').tinymce({
  ...
  extended_valid_elements: "audio[id|class|src|type|controls]",
  ...
})

上記の例では、小さなmceエディターで目的の要素プロパティを持つ'audio'タグを挿入できます。

注：私はtiny mce jqueryプラグインを使用していますが、通常のtinymceでも同じです。

于 2013-01-05T14:16:05.947 に答える
0

tinymce 設定の valid_elements と valid_children を見てください。Tinymce は、構成に一致しない/無効な html タグを取り除きます。

于 2012-11-30T09:59:19.750 に答える