0

dataProcessor htmlFilter を使用して、条件に一致する ckeditor "要素" の onclick イベントをアタッチしようとしています。SDK は、内部「要素」のネイティブ dom 要素を返すメソッド $ を文書化します。

{Object} $ 導入: 3.0 このクラス インスタンスによって表されるネイティブ DOM オブジェクト。var element = new CKEDITOR.dom.element( 'span' ); alert( element.$.nodeType ); // "1"

私が達成したいのはこれです：

ユーザーが属性「data-notes」を持つドキュメント内の div をクリックしたときに、ユーザーが特別なメモを入力するためのカスタム ポップアップ ウィンドウを表示したいと思います。ユーザーが入力したコンテンツは、その div の innerHTML に挿入されます。ドキュメントに「メモ」を挿入できるセクションがいくつかあり、ユーザーは現在のドキュメントに「メモ」または追加の htmlFilter ルールによってクリック可能な別のセクションも含むテンプレートを含めることができます。

 editor.dataProcessor.htmlFilter.addRules(
                    {
                        elements :
                        {
                            div : function( element )
                            {
                                if (element.attributes.data-notes) {
                                  console.log(element) // exists..great
                                  console.log(element.$) // undefined!
                                  element.$.onclick = function() { ... }
                                }

                            }
                        }
                    });
4

1 に答える 1

1

dataProcessor は、ネイティブ DOM 要素でも CKEditor 要素でも機能しません。これは、DOM のテキスト表現 (タグ + 属性 + 内部コンテンツ) にすぎない単純化された合成要素で機能します。したがって、この方法に従うことはできません。

解決策は、プレースホルダー プラグイン( demo )に似たものです。違いは、プラグインにはわずかに異なるgetSelectedPlaceholder実装 (特定の属性を持つ div を探しているため)、onclick (doubleclick の代わりに。ただし、これは変更しません)、createPlaceholderと dataProcessor はありません。

素敵なコーディングを！;)

于 2012-10-18T22:23:39.060 に答える