Question

我正在尝试动态地将jQuery滑块中的div结构包含到我的索引页面中。

$( "body" ).on( "click", ".abc", function() {
    var photo = '<li><img src="img/photos/photo-1.png" title="Photo 1"></li>';
    // .. other li's
    $('#banner-fade ul.bjqs').append(photo);
});

成：

<div class="slider" id="photo_1">
    <div id="banner-fade">
    <ul class="bjqs">
            // here should the list items come.
        </ul>
    </div>
</div>

问题是javascript无效，只显示第一张图片。这怎么可能？

- ＆GT;当我将li粘贴到ul中时，它会起作用。但是当我尝试使用jQuery追加它时。

Answer 1

只是一个演示

$(document).ready(function(){
 $(document).on( "click", ".abc", function() {
    var photo = '<li><b>test1</b></li>';
    $('#banner-fade ul.bjqs').append(photo);
  });
});

检查一下 - http://jsfiddle.net/6a6Fx/2/

Answer 2

看起来就像我刚才在其他问题here中回答的那样。

您需要做的就是将代码包装在

中

$(function(), {
  // Your code goes here...
});

并确保您的<script></script>标记都在<head>容器内。

动态附加jQuery滑块

2 个答案: