2011-12-23 8 views
4

ポップアップ(カラーボックスまたはファンシーボックス)でCKEditorを開くと、初めて正常に動作します。クロムのポップアップで2回目を開いたときにCKEditorを編集できません

ポップアップを2回目に閉じて開いた場合、コンテンツ領域はクリック/編集できず、コンテンツが表示されません。

しかし、「ソース」ボタンをクリックした後に表示され、デザインビューで利用可能になったときにコンテンツが表示されます。これはIEとFirefoxではうまくいきますが、問題はCHROMEです。

私はCKEditor loading in Colorbox not working [ Google Chrome ]で言われていることに従っていますが、まだ私はこの問題があります。以下は

私は自分のアプリケーションに持っているもののサンプルコードです:

<html> 
<head> 
    <title>CKEditor Sample</title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
    <script type="text/javascript" src="http://ckeditor.com/apps/ckeditor/3.6.2/ckeditor.js?1324772165"></script> 

    <link href="http://fancybox.net/js/fancybox-1.3.4/jquery.fancybox-1.3.4.css" rel="stylesheet" type="text/css" media="screen" /> 

    <script type="text/javascript" src="http://fancybox.net/js/fancybox-1.3.4/jquery.fancybox-1.3.4.js"></script> 

    <script type="text/javascript"> 

     $(function() { 
      if (CKEDITOR.instances['taCKEditor']) { 
       delete CKEDITOR.instances['taCKEditor']; 
      } 
      CKEDITOR.config.height = '500px'; 
      CKEDITOR.config.width = '500px'; 
      CKEDITOR.config.enterMode = CKEDITOR.ENTER_BR; 
      CKEDITOR.config.shiftEnterMode = CKEDITOR.ENTER_P; 
      CKEDITOR.config.startupFocus = true; 
      CKEDITOR.config.baseFloatZIndex = 9000; 
      CKEDITOR.replace('taCKEditor', 
     { 
      uiColor: '#fdd1ad', 
      toolbar: 
      [ 
       ['Source', '-', 'NewPage', 'Preview'], 
       ['Cut', 'Copy', 'Paste', 'PasteText', '-', 'Print', 'SpellChecker'], 
       ['Undo', 'Redo', '-', 'Find', 'Replace', '-', 'SelectAll', 'RemoveFormat'], 
       '/', 
       ['Bold', 'Italic', 'Underline', 'Strike', '-', 'Subscript', 'Superscript'], 
       ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'], 
       ['Link', 'Unlink', 'Anchor'], 
       ['Image', 'Table', 'HorizontalRule', 'Smiley', 'SpecialChar', 'PageBreak'], 
       '/', 
       ['Styles', 'Format', 'Font', 'FontSize'], 
       ['TextColor', 'BGColor'] 
      ] 
     }); 

      $("#various1").fancybox({ 
       'titlePosition': 'inside', 
       'transitionIn': 'none', 
       'transitionOut': 'none' 
      }); 
     }); 
    </script> 

</head> 
<body> 
    <a id="various1" href="#inline1" ">Open CKEditor</a> 
    <div id="inline1"> 
     <textarea id="taCKEditor" name="taCKEditor" rows="2" cols="5">This is the sample text inside CKEditor</textarea> 
    </div> 
</body> 
</html> 
+0

リンクは、 – JFK

+0

@JFKの問題を見るのに役立ちます。私はこの質問にサンプルを含めました。 – Prasad

+0

誰かがこれに対する解決策を得ましたか?それでもクロームに問題があります。 – Prasad

答えて

0

フォームと内部のフォームインサートテキストエリアを作成する必要があります。フォームIDにfancyboxを割り当てます。 JavaScriptのトリガーでフォームをクリックします。 fancyboxのコールバックbeforeLoadでは、インスタンスが存在するかどうかをチェックするCKEditorローダーを使用し、存在しない場合はそれを削除します。 beforeLoadでは、htmlブロックからckeditorコンテンツにロードされます。

関連する問題