Question

我尝试创建一个基于WordPress的单页网站，并将页面内容加载到div onClick中。但是，由于在加载页面内容之前已经加载了JavaScript，因此脚本无法正常工作。

临时网站位于：http://upsilon.lunariffic.com/~swstr0/

如果您点击“客户” - >“我们与您合作的人”，我们会看到问题所在。没有滑动的徽标滑块。没有箭头，并且根据浏览器，链接不起作用。

可能是因为这个脚本已经加载了？ http://upsilon.lunariffic.com/~swstr0/wp-content/plugins/logo-slider/jquery.cycle.all.min.js?ver=3.9.1

这是我目前使用的代码，可以让div滑下（或向上）并加载页面内容：

<script type="text/javascript">
jQuery(function($) {
$("li.btn-slide a").on('click', function(e){
    e.preventDefault();

    var post_url = $(this).attr("href");
    var post_id  = $(this).attr("rel");

    $("#page-con").html("loading...")
                  .load(post_url, function() { // content loaded callback

        var pageconHeight = $("#page-con").height();  // Find the height of the content inside #panel
         $("#panel").animate({height: pageconHeight}, "slow"); // Animate the height of #panel

    });
});

}）;

Answer 1

运行滑块脚本时，它会将滑块效果应用于现有元素。如果您在页面中添加了新内容，则需要重新应用该脚本。

这一行之后：

$("#panel").animate({height: pageconHeight}, "slow"); // Animate the height of #panel

添加

$('#idOfYourLoadedContent').cycle();

WordPress：在div中加载动态页面内容后加载JavaScript / JQuery

1 个答案: