jQuery的不與JS

Question

進口我在body年底有此代碼的div運行：

$(document).ready(function() { 

    var includes = $('[data-include]'); 
    jQuery.each(includes, function(){ 
     var file = $(this).data('include'); 
     $(this).load(file); 
    }); 

    var s = '.item .text'; 
    s.css('opacity', 0); 
    $(s).hover(function(){ 
     $(this).animate({opacity: 100}, 1000); 
    },function(){ 
     $(this).animate({opacity: 10}, 1000); 
    }); 
}); 

第一部分進口一堆從外部文件，其中包含了一堆.item的div HTML的塊。

第二部分應該是讓它們在懸停時淡入淡出。

但第二部分從來沒有工作。懸停時沒有任何反應。

感覺像是與執行順序有關嗎？

我試過$(document).ready塊內外的這些腳本，但無法使其正常工作。

Answer 1

應該$(s).css('opacity', 0);不s.css('opacity', 0);

Answer 2

嘗試下面給出的代碼。假設你的動畫功能是正確的，我只添加了等待所有div加載的邏輯。

var numLoadedFiles = 0; 
var numIncludesDivs = 0; 
$(document).ready(function() { 
    var includes = $('[data-include]'); 
    numIncludesDivs = includes.length; // store no. of divs to be loaded 
    jQuery.each(includes, function(){ 
     var file = $(this).data('include'); 
     $(this).load(file, function(){ 
     numLoadedFiles++; // update how many divs have been loaded 
     if(numLoadedFiles === numIncludesDivs){ 
      // all divs have been loaded now 
      attachHoverHandler(); 
     } 
     }); 
    }); 
});//document ready() 


function attachHoverHandler(){ 
    var s = '.item .text'; 
    $(s).css('opacity', 0); 
    $(s).hover(function(){ 
     $(this).animate({opacity: 100}, 1000); 
    },function(){ 
     $(this).animate({opacity: 10}, 1000); 
    }); 
}//attachHoverHandler()