1

在 CPT 元盒中,我正在使用wp_editor(). 第一个是通过 php 函数加载。但是,当我通过 jQuery 克隆表单字段时,它不会添加 wp_editor,而是添加简单的 textarea。

所以在这里我找到了一个通过javascript加载wp_editor的脚本。但是,当我尝试克隆/附加表单字段时,它不会加载 wp_editor,而是加载简单的 textarea。

我相信 DOM 不会加载wp_editor()js 函数。那么谁能告诉我如何为克隆字段加载 wp_editor ?

jQuery

// Just to cross check. This is loading wp_editor on page load
jQuery('.cn-wp-editor').wp_editor();

// wp_localization
var title = cn_fields.title;
var teditor = cn_fields.editor;

// adding incremental id
var i = 1;

// clone fields
$('#add_item').on('click', function () {
    i++;
    $('#fieldgroup').append('<div class="formgroup"><div class="card-meta-box"><label for="card_title" class="card-field-label">Item Title</label><input type="text" name="' + title + '[]" id="' + title + i +'"></div><div class="card-meta-box"><textarea name="' + teditor + '[]" id="' + teditor + i +'" class="cn-wp-editor"></textarea></div><button class="remove">x</button></div><!-- formgroup -->');
    return false; //prevent form submission
});

// remove fields
$('#fieldgroup').on('click', '.remove', function () {
    $(this).parent().remove();
    return false; //prevent form submission
    i--;
});
4

1 回答 1

2

wp_editor()每当您复制/复制该字段时,您都需要重新初始化。您的代码在页面加载时不在 DOM 中作为复制/创建的字段不起作用,因此wp_editor()没有附加到这些新字段。

检查此代码:

$('#add_item').on('click', function () {
    i++;
    $('#fieldgroup').append('<div class="formgroup"><div class="card-meta-box"><label for="card_title" class="card-field-label">Item Title</label><input type="text" name="' + title + '[]" id="' + title + i + '"></div><div class="card-meta-box"><textarea name="' + teditor + '[]" id="' + teditor + i + '" class="cn-wp-editor"></textarea></div><button class="remove">x</button></div><!-- formgroup -->');
    $('#' + title + i).wp_editor(); //<------ add this line
    return false; //prevent form submission
});

希望这可以帮助!

于 2017-06-01T10:27:41.333 回答