CKEditor + Fancybox = FAIL？

Question

CKEditor + Fancyboxは、スクリプトがFancyboxによって開かれたページにのみ読み込まれる場合に動作するようです。ただし、親ページがCKEditorを初期化している場合、CKEditorsを持つFancyboxで開いているページはすぐには動作しません。

各インスタンスには一意のIDがあります。

エディタは表示されますが、コンテンツは空白でクリックできません。 SOURCEと他のボタンをクリックすると、多くの場合完全な機能が起動します。

私はCKEDITOR.replaceAll();をFancybox afterShow()コールバックに追加しようとしました。

誰でもこれを行う運がありますか？

Answer 1

古い質問が、ちょうど参考のために、この問題はまだ両方のモジュールの現在のバージョンでは解消されないよう..

私は見つけるこれを回避する最良の方法は、わずかなタイムアウト後の要素にCKEditorバージョンを作成することです。

この例では、.htmlページにidが 'ckeditor-textara'のテキスト領域があります。端数を遅らせることで、より確実にレンダリングするためにテキスト領域を取得できます。 Fancyboxがckに素晴らしいプレーしない

$.fancybox({ 
      'type' : 'ajax', 
      'autoDimensions' : true, 
      href : '/scat-porn.html', 
      onComplete : function() { 
       setTimeout(function() { 
        CKEDITOR.replace('ckeditor-textarea', 
        { 
         toolbar : 'Basic', 
         mode : 'wysiwyg' 
        }); 
       }, 500); 
      }, 
      ... 
      }); 

（トレードオフはCKEditorバージョンの可用性がちょうど若干の遅れです）。私はそれがDOMと混乱しているajaxコンテンツのコピーをしているからだと思います（私は正確な原因としてそれを確認するのにあまり時間を費やしていませんが）。 onCompleteが終了した後まで、ckeditorを遅らせることで、より良い結果が得られます。基本的にはDOMイベントはあなたが何をする必要があるかそう上書きされている

Answer 2

は、問題を解決するために後負荷でのsetTimeoutを使用している：

//all your existing stuff goes here... 
$("#id_of_fancybox_thingy").fancybox({ 
    afterLoad:function(){ 
     setTimeout(function(){ 
     if (CKEDITOR.instances['elementname']) { 
       CKEDITOR.instances['elementname'].destroy(); 
       delete CKEDITOR.instances['elementname']; 
      } 
      CKEDITOR.replace('elementname'); 
     }, 1000); 
    } 
}); 

Answer 3

$('a.fancybox').fancybox({ 
    parent: "body", 
    afterLoad  : function() { 
     var editor = CKEDITOR.instances['post_body']; 
     if(editor){ 
      CKEDITOR.instances['post_body'].destroy(); 
     } 
     CKEDITOR.replace('post_body'); 
    }, 
    beforeLoad : function() { 
    }, 
    beforeClose : function() { 
     CKEDITOR.instances['post_body'].destroy(); 
    } 
}); 

post_body -