jquery plugin this.each in function

Question

私は小さなjqueryプラグインを作成しようとしています。以前は主にJavaScriptを使っていました。 this.each関数を理解していません。まず、$ .fnの新しいメソッドを記述します。このメソッドでは、offset（）を取得したい。すべての要素のtop。

$.fn.jquerynParalFade = function() { 
    this.each(function() { 
    console.log($(this).offset().top); 
    }); 
} 

これは問題なく機能します。しかし、画面のサイズを変更した場合（たとえば、デバイスを回転させるなど）、すべての要素の新しい位置を取得したいと考えています。このため私はサイズ変更時に実行できる関数を追加しました。

$(window).resize(function() { 
    resize(); 
}); 

ここでは、関数のthis.each（）を使用できないという問題があります。代わりに$(this).eachを使用します。しかし、私がコンソールにすれば、offset()は$(this)の機能ではないことがわかります。私はjQueryプラグインの機能にthis.eachを使用して、どのように

function resize(){ 
    $(this).each(function(index) { 
    console.log($(this).offset().top); 
    }); 
} 

：

これは、そのコードがどのように見えるのですか？あなたは、サイズ変更が正しく動作するために何thisすると、あなたの関数にあるのコンテキストをバインドする必要があります

Answer 1

：

var myResize = resize.bind(this) 
myResize() // now it should work 

もう一つの方法は、コンテキストを渡すことです：

function resize (context) { 
    context.each(...) 
} 

$(window).resize(function() { resize(this) }) 

いくつかの概念へについて：

• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this