javascript - jQuery 仅在页面刷新时触发

Question

正在为网站制作 slider 。使用 woo 主题提供的 Flexslider。我无法让 slider 正常加载和工作。截至目前，在初始页面加载时， slider 中的图像按 li 顺序显示。我必须刷新页面才能隐藏幻灯片并使 slider 起作用。

我当前的脚本:

放置在 slider 正上方的主体中 –

$(window).load(function() {
              $('.flexslider').flexslider({
                animation: "slide"
              });
            });

并放置在页面底部的页脚中 –

$(function(){
  SyntaxHighlighter.all();
});
$(window).load(function(){
  $('.flexslider').flexslider({
    animation: "slide",
    start: function(slider){
      $('body').removeClass('loading');
    }
  });
});

我已经在网站上的类似主题中搜索了很多解决方案，但似乎无法找到解决我的问题的解决方案。我已经用 $(document).ready() 替换了我的 $(window).load(function() { 但仍然没有运气。

如有任何帮助，我们将不胜感激。

Answer 1

在您的 init.js 中加载页面内容并更新 url 以使其看起来像是一个新页面。插入新页面的内容时，我找不到任何地方重新附加/重新启动幻灯片代码。因此，请尝试将这部分添加到您的代码 (init.js) 中。它对我使用控制台在您的站点上进行测试很有用。

找到此代码/函数并按照建议添加。

$(document).on("ajaxComplete", function(w, v, u) {
    mypath = u.url;
    mypath = mypath.replace("http://www.palomaspices.com/", "");
    mypath = mypath.replace("http://palomaspices.com/", "");
    mypath = mypath.replace("http://palomaspices.com/", "palomaspices.com");

//Start of new code
    $('.flexslider').flexslider({
        animation: "fade",
        start: function(slider) {
            $('body').removeClass('loading');
        }
    });
/end of new code

    _gaq.push(["_trackPageview", mypath])
});