0

私は次のようなJavaScriptクラスを持っています

MyClass = function() { }
MyClass.prototype.init = function(param){ }
MyClass.prototype.reset = function() { }

これを使用してHTMLページからこれらの関数を呼び出すとうまく機能しますonClick="reset()"。しかし、これらの関数をjQueryから呼び出すと、機能しません。私に提案してください。jQueryからのサンプル呼び出し：

$(document).ready(
    function()
    {
        app = new MyClass();
        app.init(someid, url,
            "event_handling": {
                "event1":app.reset
            });
    })

上記に加えて、次のようなCSSルールを追加することは可能ですか？

"css_class_names": {
                        style-1: "firstStyle",
                        style-2: "secondStyle"
                    }

可能であれば、IDを持っている特定の要素にスタイルを適用するにはどうすればよいですか？

4

2 に答える 2

1

あなたの問題は、アプリが event1 を呼び出すときに、意図したものとは異なるコンテキストから app.reset を呼び出すことです。つまり、app.reset では、"this" 変数は意図したとおりにはなりません。その理由は、宣言するevent1: app.resetと、event1 が関数 app.reset に設定されるためです。

回避策:

"event1": function() { app.reset(); }
于 2013-02-28T09:21:00.507 に答える
0

jQuery からの呼び出しは実際には示されていませんが、次のように推測できます。以下のブレークの下のメモを参照してください。

仮定:

$("some selector").click(app.reset);

...appのメソッドの 1 つをイベント ハンドラーとして渡します。

機能しない理由は、メソッドの呼び出し内でインスタンスを参照thisせずapp、DOM 要素を参照するためです。JavaScript では (今のところ)、this関数が定義されている場所ではなく、関数がどのように呼び出されるかによって完全に定義されます。

thisjQuery の$.proxyfunctionを使用して、呼び出し中に関数に正しい値を与えることができます。

$("some selector").click($.proxy(app.reset, app));

別の方法として、ECMAScript5 はFunction#bindこれを次のように定義しています。

$("some selector").click(app.reset.bind(app));

...しかし、それを実装するエンジンで実行しているか、ES5 shim を配置している必要があります。

または、たまたまクロージャーが手元にある場合は、クロージャーを使用できます。

$("some selector").click(function() {
    app.reset();
});

appそこでは、変数の上にクロージャー (イベント ハンドラーとして渡す関数) を作成することで、変数が横たわっているという事実を利用しています。

詳細 (私のブログ):

あなたのコードで：

$(document).ready(
    function()
    {
        app = new MyClass();
        app.init(someid, url,
            "event_handling": {
                "event1":app.reset
            });
    })

上記の議論は、

"event1":app.reset

ある時点で後で を呼び出した場合event1()、 でthisはありませんapp。

次のように、上記の修正を適用できます。

jQuery.proxy:

"event1":$.proxy(app.reset, app)

Function#bind:

"event1":app.reset.bind(app)

閉鎖：

"event1":function() { app.reset(); }
于 2013-02-28T09:21:23.537 に答える