首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >Lightbox在AJAX加载部件上不起作用

Lightbox在AJAX加载部件上不起作用
EN

Stack Overflow用户
提问于 2011-10-05 02:56:10
回答 1查看 1.6K关注 0票数 0

我有一个页面与5张图片和一个按钮,以加载更多使用AJAX。我正在使用这个脚本加载其余的图片:

代码语言:javascript
复制
<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加载的那张图片上。有人能帮我解决这个问题吗?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2011-10-05 03:09:06

代码语言:javascript
复制
$(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中找到

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/7652726

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档