如何獲得jQuery中的內部選擇器回調函數內的當前父選擇器的實例

Question

我試圖通過點擊'.sbSelector'將窗口向下滾動200px，如果單擊的元素（即'.sbSelector' ）定位在距窗口高度小於200px處。

$(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); 
     }); 
    } 
}); 

注：當顯式地設置窗口對象上，要小心，不要覆蓋窗口對象的當前屬性。此外，這在某些環境下不起作用，如node.js。