File upload TinyMce如何使用拖放上传多个图像

File upload TinyMce如何使用拖放上传多个图像,file-upload,drag-and-drop,tinymce-5,File Upload,Drag And Drop,Tinymce 5,我有个问题,似乎找不到解决办法。我正在尝试上传多个图像,并将其放在编辑器中。但我没有找到一个选项来负责多个文件上传。有人能告诉我是否有这种可能性吗?如何解决这个问题 这是我的电话号码。组件TinyMCE 5.7.1 tinymce.init({ selector: 'textarea.fullEditor', plugins: ['link', 'image', 'code'], toolbar: 'undo redo | image code | alignleft a

我有个问题,似乎找不到解决办法。我正在尝试上传多个图像,并将其放在编辑器中。但我没有找到一个选项来负责多个文件上传。有人能告诉我是否有这种可能性吗?如何解决这个问题

这是我的电话号码。组件TinyMCE 5.7.1

tinymce.init({
    selector: 'textarea.fullEditor',
    plugins: ['link', 'image', 'code'],
    toolbar: 'undo redo | image code | alignleft aligncenter alignright alignjustify',
    automatic_uploads: true,
    file_picker_types: 'image',
    relative_urls: false,
    remove_script_host : true,
    document_base_url : "/",
    convert_urls : true,
    images_upload_handler: function (blobInfo, success, failure) {
        var xhr, formData;

        xhr = new XMLHttpRequest();
        xhr.withCredentials = false;
        xhr.open('POST', '/admin/location/attachment/' + inputId.value);

        xhr.onload = function () {
            var json;

            json = JSON.parse(xhr.responseText);

            if (xhr.status != 200) {
                failure('HTTP Error: ' + xhr.status + ' ' + json.message);
                return;
            }

            if (!json || typeof json.location != 'string') {
                failure('Invalid JSON: ' + xhr.responseText);
                return;
            }

            success(json.location);
        };

        formData = new FormData();
        formData.append('form[file]', blobInfo.blob(), blobInfo.name());
        formData.append('form[_token]', inputToken.value);

        xhr.send(formData);
    },
    setup: function (editor) {
        editor.on('change', function () {
            this.save();
        });

        editor.on('PostRender', function() {
          var container = editor.getContainer();
          var uiContainer = document.querySelector('body > .tox.tox-tinymce-aux');
          container.parentNode.appendChild(uiContainer);
        });

        editor.on('NodeChange', function (e) {
            if (e.element.tagName === "IMG") {
                e.element.setAttribute("data-src", e.element.currentSrc);
                e.element.setAttribute("class", 'lazy-image');
            }
        });

        editor.on('submit', function(e) {
            this.save();
            let content = new DOMParser().parseFromString(this.getContent(), 'text/html').body.childNodes[0];
            let imageElements = content.querySelectorAll('img');
            imageElements.forEach(c=> c.removeAttribute('src'));
            this.setContent(content.innerHTML);
        });

        editor.on('init', function(e) {
            let content = new DOMParser().parseFromString(this.getContent(), 'text/html').body.childNodes[0];
            let imageElements = content.querySelectorAll('img');
            imageElements.forEach(c=> c.setAttribute('src',c.getAttribute('data-src')));
            this.setContent(content.innerHTML);
        });
    },
    file_picker_callback: function (cb, value, meta) {
        var input = document.createElement('input');
        input.setAttribute('type', 'file');
        input.setAttribute('accept', 'image/*');

        input.onchange = function () {
            var file = this.files[0];

            var reader = new FileReader();
            reader.onload = function () {

                var blobCache = tinymce.activeEditor.editorUpload.blobCache;
                var base64 = reader.result.split(',')[1];
                var blobInfo = blobCache.create(file.name, file, base64);
                blobCache.add(blobInfo);

                /* call the callback and populate the Title field with the file name */
                cb(blobInfo.blobUri(), {title: file.name});
            };
            reader.readAsDataURL(file);
        };

        input.click();
    },
    content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:14px }'
});