1

私は言語の知識を超えたJavascriptカーファッフルを持っています。

CKEditor用のカスタムプラグインを作成しています。プラグインは、CKEditorによって生成されたDIVで開くIFrameです。

IFrame内には、いくつかの画像を表示しています。ユーザーがこれらの画像の1つを選択すると、その画像を表示するために必要なHTMLコードがCKEditorに挿入されます。

これを動的に行うことは、私が立ち往生しているところです。私は次のようにIframe内からCKEditorインスタンスに接続しています:

var CKEDITOR = window.parent.CKEDITOR;    

CKEditorは、[OK]ボタン(CKEDitorによってレンダリングされた)がクリックされたときにトリガーされる「OKリスナー」を提供します。そのOKリスナーはIFrameの外にあります。

静的な値で機能するOKリスナーを定義すると、次のように機能します。

var okListener = function(ev) {
   this._.editor.insertHtml('<img class="symbol" src="my_static_symbol.gif">');
   CKEDITOR.dialog.getCurrent().removeListener("ok", okListener);
};

// Assign OK listener
CKEDITOR.dialog.getCurrent().on("ok", okListener);

しかし、OKリスナーを割り当てたときの戻り値はまだわからないので、次のようなことをする必要があります。

var okListener = function(ev) {
   this._.editor.insertHtml('<img class="symbol" src="'+my_dynamic_value()+'">');
   CKEDITOR.dialog.getCurrent().removeListener("ok", okListener);
};

// Assign OK listener
CKEDITOR.dialog.getCurrent().on("ok", okListener);

my_dynamic_valueしかし、CKEditorの「OK」ボタンによって起動された時点で関数のスコープ外にあるため、これは機能しません。

もちろん、ユーザーがリストで別の画像を選択するたびに、okListener関数を更新し、それを使用して現在の値をハードコーディングするevalこともできます。しかし、それは私にとって恐ろしい資源の浪費のように感じます。

okListener()内からIframeからのものにアクセスできるように使用できるスコープトリックはありますか?

これが十分に明確であることを願っています。そうでない場合は、コメントして明確にします。

4

2 に答える 2

5

ただし、これは機能しません。これは、my_dynamic_valueが、CKEditorの[OK]ボタンによって起動された時点で関数のスコープ外にあるためです。

わかった。たぶんそれは実際には機能しませんが、説明は間違っています。JavaScriptでは、変数は字句スコープを持っています。これは、関数(ハンドラー)が宣言されたときにmy_dynamic_valueがスコープ内にある場合、それは永久にそこに残ることを意味します。どのようなエラーメッセージが表示されますか?

于 2009-12-21T00:28:33.503 に答える
1

リスナーを作成する関数を記述して、動的な値を渡すことができます(スクリプトの残りの部分の記述方法に応じて、関数または文字列として)。

function createOKListener(imgURLFunc) {
   return function(ev) {
      this._.editor.insertHtml('<img class="symbol" src="'+imgURLFunc()+'">');
      CKEDITOR.dialog.getCurrent().removeListener("ok", okListener);
   };
};

// Assign OK listener
CKEDITOR.dialog.getCurrent().on("ok", createOKListener(function() {iframeRef.path.to.imageURL}));

または:

function createOKListener(imgURL) {
   return function(ev) {
      this._.editor.insertHtml('<img class="symbol" src="'+imgURL+'">');
      CKEDITOR.dialog.getCurrent().removeListener("ok", okListener);
   };
};

// Assign OK listener
CKEDITOR.dialog.getCurrent().on("ok", createOKListener(path.to.imageURL));

何が起こっているのかは、関数がトップレベルウィンドウのコンテキストで実行されていることだと思います。これが正しいかどうかは、CKEditorのイベントの実装によって異なります。この場合は、iframeウィンドウ(imgURLFuncバージョンで概説)を介してiframeのグローバル変数にアクセスするか、(で行うようにcreateOKListener)値をローカル変数にバインドしてみてください。

何が起こるかというと、グローバル変数(以外window)はのプロパティとして解決されます(コードブロックwindowの周りにあると想像してください)。with (window) {...}CKEditorがイベントを発生させるときCKEDITOR、それはwindow.parent(iframeからの)のコンテキストで発生します。

于 2009-12-21T00:13:07.520 に答える