將事件處理程序附加到刷新類的所有span元素的直接父元素

Question

我再次來到這裏尋求幫助，我很感激您的建議。

我有一個小型項目工作。那麼我需要的是使用jQuery通過類刷新來查找所有span元素，並將一個click處理程序附加到它的直接父級。我可以使用jQuery的bind（），但正如我們所知，它不適用於將來添加的元素。如果我在過去的黃金時期，我會使用live（），但由於它已被棄用，我不能使用它。

我的另一個選擇是使用委託函數，但委託函數我無法傳遞選擇器參數。

這是我的小提琴。 http://jsfiddle.net/ardeezstyle/hRhT7/2/

$('.refresh').parent().bind('click',function(){ 
      $(this).css({'position':'relative','background':'#fff'}).append('<span>').find('span:last').addClass('refreshing'); 

     _this=$(this); 
    setTimeout(function(){ 
     _this.removeAttr('style').find('span.refreshing').remove(); 
    }, 1000); 

}); 

我將不勝感激任何幫助。

乾杯！

Answer 1

由於有沒有父類的選擇器，你必須將處理程序委託給每個元素，並在事件發生時檢查它是否是父類。

$(document).on('click', '*', function() { 
    if ($(this).children('.refresh').length) { 
     // do stuff 
    } 
}); 

Answer 2

上使用委派事件

var parentID=$('.refresh').parent().attr('id'); // using id of parent.. you can get any attributes of parent here...if id is not present.. 
$(document).on('click','#'+parentID,function(){ 
    $(this).css({'position':'relative','background':'#fff'}).append('<span>').find('span:last').addClass('refreshing'); 

    _this=$(this); 
    setTimeout(function(){ 
    _this.removeAttr('style').find('span.refreshing').remove(); 
    }, 1000); 

}); 

它最好使用本文檔中的最接近的靜態父容器則更好pereformances文檔本身.. link閱讀更多有關事件