我有一个页面与5张图片和一个按钮,以加载更多使用AJAX。我正在使用这个脚本加载其余的图片:
<script type="text/javascript">
$(document).ready(function(){
$("#loadmorebutton").click(function (){
$('#loadmorebutton').html('<img src="<?php bloginfo('template_url'); ?>/img/ajax-loader.gif" />');
$.ajax({
url: "<?php bloginfo('template_url'); ?>/includes/loadmore.php?lastid=" + $(".postitem:last").attr("id"),
success: function(html){
if(html){
$("#wallPosts").append(html);
$('#loadmorebutton').html('Load More');
}else{
$('#loadmorebutton').replaceWith('<center>No more posts to show.</center>');
}
}
});
});
});
</script>首先,显示5张图片,当用户点击较旧的帖子时,会加载更多的5张图片。现在我的问题是,虽然所有的图片都有相同的代码/类/结构,但lightbox只在前5张图片上工作,而不是在AJAX加载的那张图片上。有人能帮我解决这个问题吗?
发布于 2011-10-05 03:09:06
$(document).ready(function(){
$("#loadmorebutton").live('click', function (){
$('#loadmorebutton').html('<img src="<?php bloginfo('template_url'); ?>/img/ajax-loader.gif" />');
$.ajax({
url: "<?php bloginfo('template_url'); ?>/includes/loadmore.php?lastid=" + $(".postitem:last").attr("id"),
success: function(html){
if(html){
$("#wallPosts").append(html);
$('#loadmorebutton').html('Load More');
}else{
$('#loadmorebutton').replaceWith('<center>No more posts to show.</center>');
}
}
});
});
});使用jQuery.Live()将事件附加到将通过AJAX添加到页面的对象。否则,当调用函数时,事件仅绑定到页面上的元素中。文档可以在here中找到
https://stackoverflow.com/questions/7652726
复制相似问题