3

このHTMLを検討してください。

<p>Click me</p>

それぞれにクリックハンドラーを使用してオブジェクトを作成したいのですがp、クリックハンドラー関数が見つからないという問題が発生しました。

このコードは機能しません：

(function(){
    var self = this;

    $("p").each(function(){
        $(this).click(self.myFunction);
    });

    self.myFunction = function(){ alert("myFunction"); }
})();​

クリックハンドラーの割り当てを関数でラップすると、機能します。

(function(){
    var self = this;

    $("p").each(function(){
        $(this).click(function(){ self.myFunction(); });
    });

    self.myFunction = function(){ alert("myFunction"); }
})();

質問：なぜ機能しない$(this).click(self.myFunction)の$(this).click(function(){ self.myFunction(); })ですか？

編集：次のコードは機能します：

$("p").click(myFunction);
function myFunction(){ alert("myFunction"); }

これも失敗するべきではありませんか？

PS関数の場所を移動することで、関数をラップする必要なしにオブジェクトを機能させることができました。

(function(){
    var self = this;

    self.myFunction = function(){ alert("myFunction"); }

    $("p").each(function(){
        $(this).click(self.myFunction);
    });
})();

問題はパーサーに関連していると思います。

4

2 に答える 2

3

これで：

(function(){
    var self = this;

    $("p").each(function(){
        $(this).click(self.myFunction);
    });

    self.myFunction = function(){ alert("myFunction"); }
})();?

参照はすぐに評価され、selfまだ何も配置されていないため、失敗します。

ここ：

(function(){
    var self = this;

    $("p").each(function(){
        $(this).click(function(){ self.myFunction(); });
    });

    self.myFunction = function(){ alert("myFunction"); }
})();

参照は、self.myfunctionが割り当てられた後、クリックが実際に発生したときに評価されます。

これは実際には問題ではなく、意図的な設計上の特徴です。

この例では：

$("p").click(myFunction);
function myFunction(){ alert("myFunction"); }

関数名はスコープの一番上に上げられています。この関数定義には動的なものがないため（つまり、オブジェクトに動的に割り当てられていないため）、このスコープ全体で上から下まで使用できます。

関数はJavaScriptの多くのギャップを埋めます。

それらはラムダ、モジュール、メソッド、関数、そしておそらく私が今は考えられない以上のものとして機能します。

于 2012-09-07T08:46:05.630 に答える
0

あなたはすでにあなたの問題を理解していると思います。ハンドラーをアタッチする時点では、self.myFunctionは定義されていないため、ハンドラーもアタッチされていません。

function(){ self.myFunction(); }ただし、のように呼び出しをラップすると、ハンドラーが接続されたときではなく、呼び出されたときに呼び出されself.myFunctionます。

于 2012-09-07T08:44:14.590 に答える