Question

我尝试使用tinymce编辑器上传图片，但脚本失败，这是错误

tinymce.activeEditor.editorUpload未定义

JavaScript和HTML代码

＆＃13;

tinyMCE.init({
    selector: '#editor',
    height: 400,
    theme: 'modern',
    plugins : 'advlist autolink lists link image charmap print preview hr anchor pagebreak image code        searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking save table contextmenu directionality emoticons template paste textcolor colorpicker textpattern spellchecker',
    toolbar1: 'undo redo | insert | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | fontsizeselect',
    toolbar2: 'print preview media | forecolor backcolor emoticons | codesample help',

    fontsize_formats: '8pt 10pt 12pt 14pt 18pt 24pt 36pt',
    // enable title field in the Image dialog
    image_title: true, 
    // enable automatic uploads of images represented by blob or data URIs
    automatic_uploads: true,
    file_picker_types: 'file image media',
    // without images_upload_url set, Upload tab won't show up
    images_upload_url: 'path_to_file',
    // override default upload handler to simulate successful upload
    images_upload_handler: function (blobInfo, success, failure) {
        var xhr, formData;

        xhr = new XMLHttpRequest();
        xhr.withCredentials = false;
        xhr.open('POST', 'path_to_file');

        xhr.onload = function() {
            var json;

            if (xhr.status != 200) {
                failure('HTTP Error: ' + xhr.status);
                return;
            }

            json = JSON.parse(xhr.responseText);

            if (!json || typeof json.location != 'string') {
                failure('Invalid JSON: ' + xhr.responseText);
                return;
            }

            success(json.location);
        };

        formData = new FormData();
        formData.append('file', blobInfo.blob(), blobInfo.filename());

        xhr.send(formData);
    },
    file_picker_callback: function(cb, value, meta) {
        var input = document.createElement('input');
        input.setAttribute('type', 'file');
        input.setAttribute('accept', 'image/* audio/* video/*');
        input.onchange = function() {
            var file = this.files[0];

            var reader = new FileReader();
            reader.readAsDataURL(file);
            reader.onload = function () {
                var id = 'blobid' + (new Date()).getTime();
                var blobCache =  tinymce.activeEditor.editorUpload.blobCache; //this is where the error occurs
                var base64 = reader.result.split(',')[1];
                var blobInfo = blobCache.create(id, file, base64);
                blobCache.add(blobInfo);

                // call the callback and populate the Title field with the file name
                cb(blobInfo.blobUri(), { title: file.name });
            };
        };

        input.click();
    }
});

＆＃13;

<form enctype="multipart/form-data" class="form-editor" method="post" id="fileinfo" name="fileinfo">
    <p>
      <textarea id="editor"></textarea>
    </p>
  </form>

＆＃13;

＆＃13; 我在codepen上尝试了它，但它确实有用，所以我真的不知道我做错了什么

https://codepen.io/tinymce/pen/132465f8d1e8c9666faf161255cb7eb8 工作实例

Answer 1

尝试tinyMCE.activeEditor.editorUpload.blobCache 不是tinymce

Answer 2

您可以尝试将tinymce.get("editor").editorUpload.blobCache替换为X.reset_index()。

无法使用tinymce编辑器上传文件

2 个答案: