Question

首先，抱歉我的英语不好，我来自德国。

我刚创建了我的第一个小部件。它是一个小部件，可以自动创建列表中的网格。

我可以添加一个新的列表项，每个表单字段都将被复制。但是在没有结果的情况下搜索互联网3天后，我决定自己问... 所以这是我的第一个问题，当我添加一个新项目时，新项目中的TinyMCE被禁用，我无法点击按钮或在其中键入文本。控制台日志中没有错误。

我的第二个问题是当我保存小部件时，所有TinyMCE-Editors都会消失并留下带有html代码的textareas。

这里也是：没有错误......但我已经看到，保存后TinyMCE没有加载。没有iframe，只有textarea。

重新加载小部件页面后，对于这两个问题，一切都很好。因此，我必须添加新项目并保存页面，然后重新加载以编辑和编辑内容，但这并不能解决问题。

我想我必须重新初始化TinyMCE，但我不知道如何。

我在将wordpress编辑器添加到我的小部件时遇到了问题，所以我从网站上集成了jQuery TinyMCE。

以下是我的add-function的代码片段：

$("body").on('click.sgw','.sgw-add',function() { 
    var sgw = $(this).parent().parent();
    var num = sgw.find('.simple-grid .list-item').length + 1;

    sgw.find('.amount').val(num);

    var item = sgw.find('.simple-grid .list-item:last-child').clone();
    var item_id = item.attr('id');
    item.attr('id',increment_last_num(item_id));

    $('.toggled-off',item).removeClass('toggled-off');
    $('.number',item).html(num);
    $('.item-title',item).html('');
    $('.custom_media_image',item).attr('src','');
    $('textarea',item).val('');
    $('img.custom_media_image',item).each(function() {
        var class_val = $(this).attr('class');
        $(this).attr('class',increment_last_num(class_val));
    });

    $('textarea',item).each(function() {
        var id_iframe = $(this).attr('id');
        tinymce.EditorManager.execCommand('mceRemoveEditor',true, id_iframe);
        tinymce.EditorManager.execCommand('mceAddEditor',true, id_iframe);
    });


    $('label',item).each(function() {
        var for_val = $(this).attr('for');
        $(this).attr('for',increment_last_num(for_val));
    });
    $('input',item).each(function() {
        var id_val = $(this).attr('id');
        var name_val = $(this).attr('name');

        $(this).attr('id',increment_last_num(id_val));
        $(this).attr('name',increment_last_num(name_val));

        if($(':checked',this)){
           $(this).removeAttr('checked');
        }
        if($(this).hasClass('custom_media_button') || $(this).hasClass('custom_media_url')){
           var class_val = $(this).attr('class');
           $(this).attr('class',increment_last_num(class_val));
        }
        if($(this).hasClass('button-primary')){
           var number_val = $(this).attr('number');
           $(this).attr('number',increment_last_num(number_val));
        }
        $(this).not('#custom_media_button').val('');
    });

    sgw.find('.simple-grid').append(item);
    sgw.find('.order').val(sgw.find('.simple-grid').sortable('toArray'));
});

我希望这是可以理解的，有人可以帮助我。您可以在此处下载zip：https://www.dropbox.com/s/22b8q29v94n7mdj/simple-grid-widget.zip?dl=0

Answer 1

您是否尝试同时运行多个编辑器？ Wordpress和TinyMCE存在限制，你一次只能有一个编辑器。我已经解决了这个问题，但这非常困难。

要加载新编辑器，您可能需要删除旧编辑器：

 tinymce.remove();

在Wordpress中保存Widget后，TinyMCE消失

1 个答案: