tinymce 5 的dialog不再支持iframe了

栏目: Html · 发布时间: 5年前

内容简介:尝试整个vue+tinymce的时候遇到点问题(之前说过,本来是用quillJS的。但如果要发表的内容支持那些微信编辑器里复制过来的内容。quill自己定义过的一些虚拟DOM就不支持了)希望是美好的,实现起来是麻烦的,最后我放弃所有的选项,改用弹框iframe的形式。然而,问题就这么来了,tinymce5的dialog居然不支持iframe了。比如你看这个:https://github.com/tinymce/tinymce/issues/4786,官方直接说不支持了。NND不过有人提示说,可以利用html

尝试整个vue+tinymce的时候遇到点问题(之前说过,本来是用quillJS的。但如果要发表的内容支持那些微信编辑器里复制过来的内容。quill自己定义过的一些虚拟DOM就不支持了)

希望是美好的,实现起来是麻烦的,最后我放弃所有的选项,改用弹框iframe的形式。然而,问题就这么来了,tinymce5的dialog居然不支持iframe了。比如你看这个:https://github.com/tinymce/tinymce/issues/4786,官方直接说不支持了。NND

不过有人提示说,可以利用htmlpanel,直接在htmlpanel的html标签里,用<iframe。。。然后我试了一下。。居然真的OK

好吧,直接参考 这个了!https://github.com/tinymce/tinymce/issues/4786#issuecomment-463827289

JS文件:

JavaScript代码

function FileManager(callback, value, meta) {  
        var windowManagerURL = "/FilManage";// filemanager path  
   
        var windowManagerCSS = '<style type="text/css">' +  
            '.tox-dialog {max-width: 100%!important; width:97.5%!important; overflow: hidden; height:95%!important; border-radius:0.25em;}' +  
            '.tox-dialog__header{ display:none!important; }' +// for custom header in filemanage  
            '.tox-dialog__footer { display: none!important; }' +// for custom footer in filemanage  
            '.tox-dialog__body { padding: 0!important; }' +  
            '.tox-dialog__body-content > div { height: 100%; overflow:hidden}' +   
            '</style > ';  
        window.tinymceCallBackURL = '';  
        window.tinymceWindowManager = tinymce.activeEditor.windowManager;  
        tinymceWindowManager.open({  
            title: '',  
            body: {  
                type: 'panel',  
                items: [{  
                    type: 'htmlpanel',  
                    html: windowManagerCSS+ '<iframe src="' + windowManagerURL + '"  frameborder="0" style="width:100%; height:100%"></iframe>'  
                }]  
            },  
            buttons: [] ,  
            onClose: function () {  
                if (tinymceCallBackURL!='')  
                    callback(tinymceCallBackURL, {}); //to set selected file path  
            }   
            
        } );  
    }  

iframe中:

JavaScript代码

var windowManager = top != undefined && top.tinymceWindowManager != undefined ? top.tinymceWindowManager : '';  
  
  
 if (windowManager != '') {  
        if (top.tinymceCallBackURL != undefined)  
            top.tinymceCallBackURL = path;  
            windowManager.close();  
    }  
本站采用版权协议, 要求署名、非商业和保持一致. 本站欢迎任何非商业应用的转载, 但须注明出自"

", 保留原始链接, 此外还必须标注原文标题和链接.


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Java Concurrency in Practice

Java Concurrency in Practice

Brian Goetz、Tim Peierls、Joshua Bloch、Joseph Bowbeer、David Holmes、Doug Lea / Addison-Wesley Professional / 2006-5-19 / USD 59.99

This book covers: Basic concepts of concurrency and thread safety Techniques for building and composing thread-safe classes Using the concurrency building blocks in java.util.concurrent Pe......一起来看看 《Java Concurrency in Practice》 这本书的介绍吧!

CSS 压缩/解压工具
CSS 压缩/解压工具

在线压缩/解压 CSS 代码

图片转BASE64编码
图片转BASE64编码

在线图片转Base64编码工具

URL 编码/解码
URL 编码/解码

URL 编码/解码