0

なぜこれが起こっているのか理解できません...

startPoint計算を行うには、mousedown に設定されたオブジェクトとe.pageYmousemove からの電流を取得する必要があります。

var adjustHeight = {
    change: function(e) {
        console.log(this.startPoint)
        console.log(e.pageY);
    },
};

$('#dragger').mousedown(function(e) {
    e.preventDefault();

    adjustHeight.startPoint = e.pageY;

    $(window).on('mousemove', adjustHeight.change());

    $(window).on('mouseup', function() {
        $(window).off('mousemove', adjustHeight.change())
    });
})

startPointただし、コンソールは、私が期待しているe.pageYが未定義のオブジェクトを出力します

しかし、代わりにこの行を使用すると

...
    $(window).on('mousemove', adjustHeight.change);

    $(window).on('mouseup', function() {
        $(window).off('mousemove', adjustHeight.change)
    });
...

期待どおりに取得しe.pageYましたが、現在startPointは未定義です。指しているものを確認したところthis、DOMWindow でした....

私の質問は、なぜこれが起こっているのか、オブジェクトのプロパティと関数の両方を同時に取得するにはどうすればよいeですか?

4

3 に答える 3

2 
$(window).on('mousemove', adjustHeight.change());

adjustHeight.changeはすぐに実行され、戻り値を に渡します.on()。に引数を渡していないのでadjustHeight.change、eになりますundefined(そしてe.pageY利用できません)。

$(window).on('mousemove', adjustHeight.change);

関数を に正しく渡す.onため、後でイベント オブジェクトがハンドラに渡され、 にアクセスできますe.pageY。しかし、コンテキスト ( this) はadjustHeightもうありません。ハンドラーをバインドした DOM 要素です。windowこの場合はプロパティがありませんwindow。startPoint

MDN のドキュメントには、 (一般的に)に関する優れた記事があり、 thisquirksmode.orgにも(イベント ハンドラーに関して) あります。

解決策:

オブジェクトを呼び出しadjustHeight.changeて渡す新しい関数をハンドラーとして渡します。event

$(window).on('mousemove', function(event) {
    adjustHeight.change(event);
});

または[docs]を使用してバインド adjustHeight.changeします。adjustHeight$.proxy 

$(window).on('mousemove', $.proxy(adjustHeight.change, adjustHeight));

後でハンドラーをバインド解除する必要があるため、変数に割り当てるか、名前空間付きのイベント[docs]を使用する必要があります。

例：

$(window).on('mousemove.dragger', $.proxy(adjustHeight.change, adjustHeight));

$(window).on('mouseup.dragger', function() {
    // removes both, the mousemove and mousup event handlers
    $(window).off('.dragger');
});
于 2012-05-12T17:28:17.307 に答える
0

..。

$(window).on('mousemove', adjustHeight.change);

$(window).on('mouseup', function() {
    $(window).off('mousemove', adjustHeight.change)
});

..。

（行：3） 

console.log("start:" + adjustHeight.startPoint)
于 2012-05-12T18:09:11.760 に答える
0

まず第一に、これは間違っています：

$(window).on('mousemove', adjustHeight.change());

次に、デフォルトchange()ではバインドされていません。adjustHeight次のようにする必要があります。

$(window).on('mousemove', function() {
    adjustHeight.change();
});

または、最新のブラウザーでは:

$(window).on('mousemove', adjustHeight.change.bind(adjustHeight));
于 2012-05-12T17:30:28.223 に答える