Question

我试图用jQuery动态创建一个滑块。我使用http://imageslidermaker.com/v2中的示例，并已下载源并将其复制到我的js和css文件夹。

我的代码：

<link rel="stylesheet" href="../css/my-slider.css"/>
<script src="../js/ism-2.0.1-min.js"></script>

        <div class="ism-slider" data-transition_type="fade" data-play_type="loop">
              <ul>
                    <li class="ism-slide-Imgs"><img src="../img/PuntaPalma/Suits-1.jpg" class="ism-img-Imgs"></li>
                    <li class="ism-slide-Imgs"><img src="../img/PuntaPalma/Suits-2.jpg" class="ism-img-Imgs"></li>
                    <li class="ism-slide-Imgs"><img src="../img/PuntaPalma/Suits-3.jpg" class="ism-img-Imgs"></li>
                    <li class="ism-slide-Imgs"><img src="../img/PuntaPalma/Suits-2.jpg" class="ism-img-Imgs"></li>
              </ul>
            </div>

通过此示例，js工作正常，但是当我尝试动态添加图片时，js不起作用。

<div class="ism-slider" data-transition_type="fade" data-play_type="loop">
  <ul>
    <!--li append from jQuery ajax-->
  </ul>
</div>

然后我打开js，我发现它有一个函数自动执行，所以问题是：如何在页面加载后执行js内部的函数？

Answer 1

使用onload。由于您使用的是jq：

$(window).load(function () {
    // do stuff
});

我看了一下这个幻灯片库，发现了您可能感兴趣的内容：

<script>
    window.ISMConfig = {no_instantiation:true};
</script>
<script src="/ism/js/ism-2.0.1-min.js?v=150717"></script>

Answer 2

没有看到你的js源代码，它有一个非常简单的jQuery方法：

$(document).ready(function(){ ... });

文档加载完成后，将调用通过此方法推送到ready堆栈的所有函数。

如何在加载页面后调用函数自动执行

2 个答案: