jquery加载后Javascript无法正常工作

Question

我正在为客户设计一个网站，对他来说一件大事（不要问我为什么）要让音乐播放整个过程，切换页面应该继续歌曲而不是重播它。我用jQuery的负载每一页基本上加载到我的index.html示例页面加载的

的内容区域

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("#maincontent").load("home.html"); 
    }); 
</script> 

页换

<script type="text/javascript"> 
    function pageChanger(page){ 
     $("#maincontent").load(); 
     window.scrollTo(0, 0); 
    } 
</script> 

正如你所看到的在http://file.gflam.com/MothersDayStore它运作良好，因为它应该。我的问题是，虽然我有此脚本加载在头

<script type="text/javascript" src="js/jquery.carouFredSel-6.0.2.js"></script> 

它运行在您第一次去的网站，你会在底部滚动看到的产品，但是，如果你离开页面，然后回去到主页他们不再在幻灯片放映中。这与我从头文件中删除jquery.carouFredSel-6.0.2.js脚本的行为相同。我的猜测（我还不是很好，因为它仍然在学习）是因为它在头部它只加载页面加载，所以当jquery加载页面内容时，它不再运行？

任何帮助保持幻灯片放映或重新加载该脚本将不胜感激。如果您需要更多的代码或更多的解释，请留下评论，因为我希望我很清楚

Answer 1

您会在home.html文件中看到此代码。将它包装在一个函数中。在页面加载后立即调用它。然后在你的各种页面加载。函数pageChanger（page），测试'home.html'，如果是的话 - 然后调用函数。翼。

$(window).load(function(){ 
    function initializeCarousel(){ 
    $('#foo4').carouFredSel({ 
     responsive: true, 
     auto: { 
      timeoutDuration : 4000,  // 5 * auto.duration 
     }, 
     width: '100%', 
     scroll: { 
      items : 4,  // 5 * auto.duration 
      pauseOnHover : true,  // scroll.pauseOnHover 
     }, 
     prev: '#prev2', 
     next: '#next2', 
     pagination: "#pager2", 
     items: { 
      width: 250, 
      height: 'auto', // optionally resize item-height 
      visible: { 
       min: 4, 
       max: 4 
      } 
     } 
    }) 
    } 
initializeCarousel(); 
}); 




function pageChanger(page){ 
    $("#maincontent").load(page); 
    window.scrollTo(0, 0); 
    if(page == 'home.html'){ 
     initializeCarousel(); 
    } 
} 

我相信有一个更简洁的处理方法。但是，您正在加载.html的事实，您已在初始页面加载时重新初始化它。当你回到'home.html'时，你已经完成了初始化。你必须重新初始化它。