JQUERY infinit滾動，將腳本應用到新加載的元素

我正在使用Yii框架。我想要無限滾動我的內容（圖片）。這部分工作正常。我唯一的問題是我必須有一個腳本才能對我的圖像產生一些效果（比如讓它們變大並在點擊時顯示一些文字）。JQUERY infinit滾動，將腳本應用到新加載的元素

<?php 

    Yii::app()->clientScript->registerScript('overlayimage',' 
     $(".overlay").hide(); 

     $(".box").click(function() { 

      if($(this).hasClass("col5")) 
      { 
       $(this).removeClass("col5").addClass("col3").fadeIn(400).find(".overlay").fadeOut(400); 
       $(".items").masonry("reload"); 
       $(this).clearQueue(); 
      } 

      else 
      { 
       $(".items").find(".col5").removeClass("col5").addClass("col3").fadeIn(400).find(".overlay").fadeOut(400); 
       $(this).removeClass("col3").addClass("col5").fadeIn(400).find(".overlay").fadeIn(400); 
       $(".items").masonry("reload"); 
       $(this).clearQueue(); 
      } 

     }) 
    ',CClientScript::POS_READY); 
?>

然而，當有無窮遠滾動（腳本是CClientScript::POS_LOAD），腳本不列入新添加的元素的工作：當我沒有無限滾動這個腳本工作正常。我試圖在infinit滾動後在CClientScript::POS_LOAD之後添加相同的腳本，但在這種情況下，對於腳本執行2次的一些元素，我認爲這不是在不同地方重複代碼的正確方法。

任何人都可以幫我找到我應該把我的腳本也執行新加載的元素？

以防萬一here是有問題的示例頁面。

來源

2012-08-08 Mahsa Teimourikia

聽起來就像你遇到了添加新項目的問題，我猜你的圖像爲.box元素，而jQuery不會將處理程序附加到這些元素上。這種情況的另一個症狀是，jQuery交互對第一次加載頁面時存在的元素起作用，但不會影響您滾動到的任何新元素。

而不是.click（），您需要使用.on()。特別感興趣的應該是委派的活動部分。

在任何情況下，你可能會需要像格式：

$("<parentSelector>").on("click", ".box", function(event) { //do some fancy stuff here })

parentSelector必須包含.box，是頁面的永久部分元素，即加載頁面加載和不會消失。

來源

2012-08-08 16:57:48 ernie

JQUERY infinit滾動，將腳本應用到新加載的元素

回答

相關問題