2017-06-21 11 views
1

私はクラスを持つ1つのdivで構成されている最も単純なウィジェットを作成しました。テンプレートは次のとおりです。CKEditorウィジェットをダブルクリックしてダイアログを開くことができません

<div class="simple" data-padding="false"></header> 

ダイアログには、パディングを変更する1つのチェックボックスがあります。

このウィジェットはすべて正常に動作し、うまくアップキャストされ、上にマウスカーソルを置くと黄色い線が表示されます。しかし、それをダブルクリックしてダイアログを開くことは不可能です。何も起こらず、コンソールエラーもありません。 div内をダブルクリックするとダイアログが開くはずです。

2番目のdivがネストされ、編集可能に設定され、いくつかのパディングがメインdivに追加されると、ダイアログを開く2つのdiv間のパディング領域をダブルクリックすることができます。もちろん私が望むものではありません。

ここで何がうまくいかない、これはバグですか?

答えて

1

まず、ダブルクリックイベントにリスナーを追加して解決しました。

CKEDITOR.plugins.add('simple', { 
    init: function(editor) { 
     editor.on('doubleclick', function(e) { 
      var ClickedWidget = e.editor.widgets.widgetHoldingFocusedEditable; 
      if (ClickedWidget != null && ClickedWidget.name == 'simple') { 
       ClickedWidget.edit(); 
      } 
     }); 

これはうまくいきましたが、編集可能な要素でテキストを選択する方法がありました。したがって、それはなぜそれがセットアップされているかを説明します。

これを正しく解決するために、ウィジェットを右クリックして編集および削除するためのコンテキストメニューを表示するプラグインを作成しました。私はこのプラグインをCKEditorのWebサイトで利用可能にしました。

http://ckeditor.com/addon/widgetcontextmenu

関連する問題