Question

我来这里是因为我与Meteorjs + Tinymce有一个大问题。希望你能帮助我...

让我解释一下我的情况。

我有自己制作的多步骤表单的基本模板。在这个基本模板中，有一个动态模板函数，它呈现每一步（单击下一步按钮，它将呈现下一步。）

有我的不同模板：

AdminTrainingsInsertForm（base）

培训师（第一步）
培训（第2步）
必要（第3步）
实用（第4步）＆lt; - 这是我在3 textarea上渲染tinymce的步骤
时间表（第5步）

这是我渲染时的代码，当渲染我的实际步骤（模板）时：

tinymce.init({
    selector: ".tinyted",
    plugins: [
        'autolink link'
    ],
    toolbar: 'undo redo | bold italic underline | link bullist',
    menubar: false,
    statusbar: false,
    inline: false,
    skin_url: '/packages/teamon_tinymce/skins/lightgray',
    setup : function(ed) {
        ed.on('keydown', function(e) {
            var body = tinymce.get($(this)[0].id).getBody(), text = tinymce.trim(body.innerText || body.textContent);

            var ref = $('textarea[id='+$(this)[0].id+']');
            text = text.replace(/(\r\n|\n|\r)/gm,"");
            var len = text.length;
            var maxChar = parseInt(ref.data('max'));

            if ( (len) > maxChar ) { // prevent type because text length > max chars authorized
                e.preventDefault();
                e.stopPropagation();
                return false;
            }

            // update count words div
            if ($(this)[0].id == 'practical-description')
                $('#description-count').html(len);
            if ($(this)[0].id == 'practical-details')
                $('#details-count').html(len);
            if ($(this)[0].id == 'practical-agenda')
                $('#agenda-count').html(len);

        });
    }
});

正如你所看到的，tinymce是textarea上的init，类微小

问题是：我在我的多步形式中做了一个流程，渲染了tinymce。我验证它，在我的mongodb中插入所有数据并渲染所有这些不同数据的列表。接下来，我正在使用这个多步骤重做一个新的流程，并且在步骤4中，没有渲染出来的......所以这是一个 show-stopper 问题:(

有人作为解决方案或解决方法吗？谢谢你的期货答案！

Answer 1

如果您使用的是加载/卸载TinyMCE的SPA样式框架，则需要确保在适当的时间init()和remove() TinyMCE。

如果您想加载TinyMCE，请使用第一次看似正确的init()。

当您“离开”该步骤时，您需要在框架删除相关DOM元素之前正确remove()每个TinyMCE实例。

当您返回该步骤后，您可以再次使用init()。如果离开该步骤时没有remove() TinyMCE，它仍然有一个编辑器对象，但它现在指向不再存在的DOM对象，因此TinyMCE不“工作”。

Tinymce随机不会在meteorjs中呈现

1 个答案: