javascript - 无法使用 jquery 在 div 之前插入 flexslider

Question

嗨，我从 woothemes.com 下载了flexslider 我有一个如下所示的页面结构

<div class="parentdiv anotherdiv">
 <div class="child-div1">some buttons here</div>
 <div class="child-div2">some content here</div>
</div>

我正在尝试使用 jquery 在 child-div1 之前再添加一个子 div。此子 div 具有滑块的标记。

Javascript

<script type="text/javascript">
$(document).ready(function() {   
$(".child-div1").prepend('<div class="flexslider"><ul class="slides">
    <li><img src="path"></li><li><img src="path"></li></ul></div>');
});   
</script>
<script type="text/javascript">
$(window).load(function() {
$('.flexslider').flexslider({
animation: "slide"
    });
});

我包含了必要的 css 和 js 文件。代码实际上是前置的。但我只能看到一个白条。滑块未显示。我究竟做错了什么？

Answer 1

你可以尝试这样的事情：

$(document).ready(function() { 
    $(".child-div1").prepend(function(){
        return $('<div class="flexslider">
                      <ul class="slides">
                         <li><img src="path"></li>
                         <li><img src="path"></li>
                      </ul>
                  </div>').flexslider({ animation: "slide" });
    });
});