TinyMCE插入/编辑图像源按钮

Question

我正在使用小型mce,并希望在插入图像对话框中有一个特殊页面的按钮

在源代码后面输入一个指向在新浏览器窗口中打开的不同页面的简单链接.我怎么能实现这一目标？

Answer 1

TinyMCE有所谓的初始化选项file_browser_callback,并file_picker_callback允许您将自己的文件浏览功能添加到插入对话框:

https://www.tinymce.com/docs/configure/file-image-upload/#file_browser_callback
https://www.tinymce.com/docs/configure/file-image-upload/#file_picker_callback
https://www.tinymce.com/docs/configure/file-image-upload/

例如,您可以在init中执行以下操作:

tinymce.init({
    file_picker_callback: function(callback, value, meta) {
        imageFilePicker(callback, value, meta);
    }
});

然后imageFilePicker函数只会调用一个函数来完成打开窗口进行选择的实际工作:

var imageFilePicker = function (callback, value, meta) {               
    tinymce.activeEditor.windowManager.open({
        title: 'File and Image Picker',
        url: '/myapp/getfilesandimages',
        width: 700,
        height: 600,
        buttons: [{
            text: 'Insert',
            onclick: function () {
                //do some work to select an item and insert it into TinyMCE
                tinymce.activeEditor.windowManager.close();
            }
        }, 
        {
            text: 'Close',
            onclick: 'close'
        }],
    }, 
    {
        oninsert: function (url) {
            callback(url); 
        }
    });
};