カスタムオプションページに「リピーター」スタイルのフィールドグループがあります。非表示状態のアクティブなビジュアルエディタがあり、ユーザーが[新規追加]をクリックすると行全体が複製されます。その後、クローンを作成した行でビジュアルエディタを初期化する必要があります。私のコード:
$('.repeater-add-new').click(function(event) {
event.preventDefault();
var target = $(this).data('repeater');
$( '#' + target).find('.repeater-row:not(.clone) .repeater-content.in').collapse();
var newRow = $( '#' + target + ' .repeater-row.clone' ).clone().appendTo( '#' + target + ' .repeater-row-wrapper' ).removeClass('clone');
rebuildIndex(target);
// Initialize editors if needed
newRow.find('.wp-editor-wrap').each(function(index, el) {
var ed_id = $(this).find('textarea').attr('id');
tinymce.init(tinyMCEPreInit.mceInit[ed_id]);
tinymce.execCommand('mceAddEditor', false, ed_id);
quicktags({id : ed_id});
});
});
インタフェースのスクリーンショット:
ページが読み込まれると、コンソールエラーが発生します。
不明なTypeError:未定義のプロパティ 'onpageload'を読み込めません
そしてもちろん、エディタは動作しません。ページを保存した後はもちろん機能しますが、行が追加されたときにも機能する必要があります。
あなたのJavaScriptを含めずにエディタを動かすことができましたか?もしそうならテンプレートを作成することを試してみてください。そして、実際のTinymceエディタを含み、そしてjQuery clone()
functionのtrueに設定されたWithDataAndEvents
引数を使用してそのテンプレートをコピーするためにあなたのjavascriptを書き直してください。
例えば:
$('.cloner').click(function(){
$('.container').append($('.template').clone(true).removeClass('hidden'));
});