0

イベントリスナーを に追加しようとしていますが、コールバックが呼び出されないため、document何らかの理由でイベントが発生しないように見えます:click

function NotJquery(element) {
    this.element = element;

    return this;
}

NotJquery.prototype.eventFired = function(event, callback) {
    console.log('in NotJquery prototype');
    return function (event, callback) {
        element.addEventListener(event, callback, true);
    };
};

var $ = function(element) {
    return new NotJquery(element);
};

function Test() {
}

Test.prototype.addListener = function() {
    console.log('in Test prototype');
    $(document).eventFired('click', function() {
        console.log('click event fired');
    });
};

(function() {
    var test= new Test();
    test.addListener();
}());

「テスト プロトタイプ内」と「NotJquery プロトタイプ内」の両方のメッセージがコンソールに記録されますが、ドキュメント内のどこかをクリックすると、「クリック イベントが発生しました」というメッセージがコンソールに出力されません。コードの何が問題なのかわかりません。誰かがそれを機能させるためのアイデアを持っていますか?

http://jsfiddle.net/Nn3tZ/1/

4

2 に答える 2

1

element関数内で定義されていませんeventFired（ただし、それだけが問題ではありません）。最小限の更新は次のとおりです。

NotJquery.prototype.eventFired = function(event, callback) {
    var self = this; // <== Change 1 of 2

    console.log('in NotJquery prototype');
    return function () {
        self.element.addEventListener(event, callback, true);
    //  ^-- Change 2 of 2
    };
};

他の一部の言語 (Java、C#) とは異なり、現在のオブジェクトのプロパティを参照する場合はオプションではありませんthis。これとは別に、作成している関数には適切な がありません。そのため、生成された関数 (クロージャ) 内でそれを格納して使用しました。eventFiredthisselfself

これとは別に、渡しeventてから、生成された関数でそれらをcallback宣言してeventFiredいます (なぜそこで関数を生成しているのかはまったくわかりません)。そのため、渡したものは決して使用されません。eventFired

もっと読む（私の貧血ブログで）：

于 2012-11-03T14:03:14.223 に答える
1

クライアントコードは次のようなものを期待しています:

NotJquery.prototype.eventFired = function(event, callback) {
    this.element.addEventListener(event, callback, false);
};

実際のデモ: http://jsfiddle.net/Nn3tZ/2/

于 2012-11-03T14:04:21.340 に答える