jqueryの内部セレクターコールバック関数内の現在の親セレクターのインスタンスを取得する方法

Question

'.sbSelector'をクリックして200pxのウィンドウをスクロールしようとしています。クリックされた要素（つまり '.sbSelector' ）は、ウィンドウの高さの下端から200ピクセル未満に配置されます。

$(document).on('click', '.sbSelector', function(){ 
    var windowHeight = $(window).height(); 
    var drpdwnOffsetTop = parseFloat($(this).offset().top - $(window).scrollTop()); 
    if(parseFloat(windowHeight - drpdwnOffsetTop) < 200){ 
     var temp = $(window).scrollTop() + 200; 
     $('html, body').animate({scrollTop: temp}, 500, function(){ 
      **// How to get the instance of current '.sbSelector' here** 
      **// $(this) ll point to $(html,body), where as i need a reference to the current $('.sbSelector')** 
     }); 

    } 
}); 

私のクエリは、$（ 『htmlの、ボディ』）内の現在の「.sbSelector」のインスタンスを取得することができる方法である。関数コールバックをアニメーション化。 Bcozには、ドキュメント内に多くの '.sbSelector'要素が存在する可能性があり、アニメーションコールバック内の現在のクリックされた '.sbSelector'を指し示したいと思います。

Answer 1

グローバル変数の詳細については、JavaScript Scopeを参照してください。

$(document).on('click', '.sbSelector', function(){ 
    var windowHeight = $(window).height(); 
    var drpdwnOffsetTop = parseFloat($(this).offset().top - $(window).scrollTop()); 
    var that = $(this); 
    if(parseFloat(windowHeight - drpdwnOffsetTop) < 200){ 
     var temp = $(window).scrollTop() + 200; 
     $('html, body').animate({scrollTop: temp}, 500, function(){ 
      console.log(that); 
     }); 
    } 
}); 

また、あなたはBrowser Object Modelにバインドすることができます

$(document).on('click', '.sbSelector', function(){ 
    var windowHeight = $(window).height(); 
    var drpdwnOffsetTop = parseFloat($(this).offset().top - $(window).scrollTop()); 
    window.that = $(this); 
    if(parseFloat(windowHeight - drpdwnOffsetTop) < 200){ 
     var temp = $(window).scrollTop() + 200; 
     $('html, body').animate({scrollTop: temp}, 500, function(){ 
      console.log(window.that); 
     }); 
    } 
}); 

注：windowオブジェクト上で明示的に設定する場合、ウィンドウオブジェクトの現在のプロパティを上書きしないように注意してください。さらに、node.jsのような特定の環境では動作しません。