TinyMCE + jbimages + autoresize 不调整大小答案

【问题标题】：TinyMCE + jbimages + autoresize not resizingTinyMCE + jbimages + autoresize 不调整大小
【发布时间】：2014-04-23 02:46:27
【问题描述】：

我正在使用带有 jbimages 插件的 TinyMCE 来上传图像。我还激活了自动调整大小插件，因此在添加/删除内容时编辑器会自动扩展和缩小。

这一切都很好，除非我上传大于编辑器视口的图像。在这种情况下，编辑器不会展开。

我初始化 tinyMCE 的代码如下：

tinyMCE.init({
    menubar: false,
    statusbar: false,
    selector: "textarea",
    plugins: [
        "advlist autolink autoresize lists link image charmap print preview anchor",
        "searchreplace visualblocks code fullscreen",
        "insertdatetime media table contextmenu paste jbimages textcolor"
    ],
    toolbar: "jbimages",
    relative_urls: false
});

我的标记看起来像：

<div class="control-group" id="cgroup-order[message]">
<label class="control-label required" id="label-order[message]" for="order[message]">Message to send:</label>
<div class="controls" id="controls-order[message]">
    <textarea name="order[message]" class="pull-left span3 message" id="order[message]"></textarea>
</div>

当 jbimages 插入图像时，似乎没有执行 mceAutoResize 命令。我已经尝试在 init 参数中添加类似这样的内容：

    setup: function(editor) {
        editor.on('SetContent', function(e) {
            editor.execCommand('mceAutoResize');
        });
    }

但这并没有多大帮助。任何想法如何使其正常工作？

编辑： 当我在插入图像后按下一个键或按下鼠标按钮时，编辑器将调整大小，但不会自动发生。

编辑 2： 好的，所以我至少现在知道这种行为的原因。发生的情况是 autoresize 插件响应编辑器的 SetContent 事件。在插入大图像时，浏览器可能会或可能不会完成图像的渲染。如果没有完成图像的渲染，自动调整大小计算的新高度仍然是旧高度，原因很明显。

我尝试了很多不同的方法，比如捕捉 mce 的 iframe 的加载事件，但这只会在页面最初加载时触发。

我最终以一种非常肮脏的方式解决了这个问题，使用 1 秒超时让浏览器有更多时间呈现图像。当然，这充其量只是一种管道胶带解决方案，因为它可能不适用于速度较慢的客户端。如果有人有更好的解决方案，请告诉我。

我的代码现在看起来像这样：

    tinyMCE.init({
    menubar: false,
    statusbar: false,
    selector: "textarea",
    plugins: [
        "advlist autolink autoresize lists link image charmap print preview anchor",
        "searchreplace visualblocks code fullscreen",
        "insertdatetime media table contextmenu paste jbimages textcolor"
    ],
    //toolbar: "insertfile undo redo | styleselect | forecolor | bold italic | alignleft aligncenter alignright alignjustify | link | jbimages",
    toolbar: "jbimages",
    relative_urls: false,
    autoresize_min_height: 200,
    //autoresize_max_height: 800,
    setup: function(editor) {
        editor.on('SetContent', function(e) {
            if (e.content.indexOf('<img ') == 0)
            {
                setTimeout(function(){ tinymce.activeEditor.execCommand('mceAutoResize'); }, 1000);
            }
        })
    }
});

【问题讨论】：

标签： tinymce

【解决方案1】：

我有一个想法，但我的问题没有这个，但它已经解决了许多图像问题。

ini_set("memory_limit","120M");

必须放在jbimages\ci\system\libraries\Upload.php文件中

在这条线上：

@copy($this->file_temp, $this->upload_path.$this->file_name);

它可能会解决您的问题。

【讨论】：