javascript - Tinymce 添加文件选择器按钮以添加链接

标签 javascript tinymce tinymce-4 tinymce-plugins

我想添加一个触发按钮来将图像作为数据上传。所以我添加了以下代码

<textarea id="test"></textarea>
<input name="image" type="file" id="test-upload" class="hidden" onchange="">

tinymce.init({
            selector: '#test',
            ...,
            paste_data_images: true,
            image_advtab: true,
            file_picker_callback: function(callback, value, meta) {
                if (meta.filetype == 'image') {
                    jQuery('#test-upload').trigger('click');
                    jQuery('#test-upload').on('change', function() {
                        var file = this.files[0];
                        var reader = new FileReader();
                        reader.onload = function(e: any) {
                            callback(e.target.result, {
                                alt: ''
                            });
                        };
                        reader.readAsDataURL(file);
                    });
                }
            },
            ...
        });

这按预期工作。我正在为图像获取一个文件选择器,如下所示

enter image description here

但是当我也尝试添加链接时,我也得到了这个文件选择器。 enter image description here

如何避免这种情况?

最佳答案

file_picker_types 设置添加到您的配置中,并指定应该在何处使用选择器。

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

默认是:

file_picker_types: 'file image media'

...但您可以将其更改为:

file_picker_types: 'image media'

...此时选择器不会出现文件(链接)。

关于javascript - Tinymce 添加文件选择器按钮以添加链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45928910/

相关文章:

javascript - Contenteditable 中的 HTML 元素?

javascript - 运行meteor mongo dump命令后获取空目录

javascript - Chrome 因模式匹配而挂起(tinymce/magento2)

javascript - 更改 url 深度与 TinyMCE 图像插入

javascript - Tinymce : Don't replicate class when adding a new paragraph on enter

javascript - 单击 HTML 选择的父项

javascript - 无法使用 Angular 矩更改时区

javascript - 我如何将tinymce和所有插件压缩到一个静态文件中?

javascript - JQuery 滚动长度/高度

angularjs - 从一组编辑器中删除 tinymce 4 编辑器