TinyMCE将原始html插入活动编辑器

swg*_*r14 3 javascript tinymce

使用WindowManager for TinyMCE我打开一个窗口,它写回原始HTML.但它截断我的图像链接.奇怪的是它不会对锚标签这么做.只是图片标签.

我有这段代码

html = '<a title="'+ $('#title').val() +'" href="'+ $('#url').val() +'"><img src="'+ $('#imgURL').val() +'" /></a>';

    var parentEditor = parent.tinyMCE.activeEditor;
    parentEditor.execCommand('mceInsertRawHTML', false, html);
    parentEditor.windowManager.close();
Run Code Online (Sandbox Code Playgroud)

它将html插入活动编辑器.当我将html登录到控制台时,我得到了

<a title="Click Action" href="yahoo.com"><img src="http://marketingedu.mychm.co/images/buttons/c2a-button4.png" /></a>
Run Code Online (Sandbox Code Playgroud)

但是,当我在tinyMCE编辑器中查看源代码时,它将图像SRC属性更改为

../../images/buttons/c2a-button4.png
Run Code Online (Sandbox Code Playgroud)

这是我对TinyMCE编辑器的整个javascript初始化

tinymce.init({
        selector: ".editor",
        setup: function(ed) {
            ed.on('change', function(e) {
                tinyMCE.triggerSave();

                $('form').trigger('checkform.areYouSure');
            });
            ed.on('init', function(e) {
                autoresize_max_height: 500
            });
            ed.addButton('defaultbtn', {
                title: 'Insert Button',
                icon: 'fa fa-plus-square',
                onclick: function() {
                    // Open window
                    ed.windowManager.open({
                        title: 'Button Selector',
                        url: "<?=$this->url('/webinar/custombuttons') ?>",
                        width: 800,
                        height: 600
                    });
                }
            });
        },
        plugins: [
            "advlist autolink link responsivefilemanager lists charmap print preview hr anchor pagebreak spellchecker",
            "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",
            "save table contextmenu directionality template paste textcolor colorpicker responsivefilemanager autoresize"
        ],
        toolbar: "undo redo | styleselect | bold italic | forecolor backcolor | alignleft aligncenter alignright | bullist numlist | outdent indent | table | link responsivefilemanager defaultbtn",
        image_advtab: true ,

        external_filemanager_path:"/filemanager/",
        filemanager_title:"Filemanager" ,
        external_plugins: { "filemanager" : "/filemanager/plugin.min.js"},
    });
Run Code Online (Sandbox Code Playgroud)

rev*_*btz 9

改变这个:

var parentEditor = parent.tinyMCE.activeEditor;
parentEditor.execCommand('mceInsertRawHTML', false, html);
Run Code Online (Sandbox Code Playgroud)

对此:

tinymce.activeEditor.setContent(html, {format: 'raw'});
Run Code Online (Sandbox Code Playgroud)

以下是有关如何以各种方式设置内容的参考链接.

希望这可以帮助.

  • 它可以与html一起使用,但是如果我想添加一些js代码,例如`&lt;script&gt; alert(“ loaded”); &lt;/ script&gt;`怎么办? (3认同)