Question

我有一个显示多个块的页面，其中包含结果详细信息。在每个块中，我有一些<a>标签，附有thickbox jQuery插件：class="thickbox"

以下是一种ampersant标签的示例：

<a class="thickbox" title="Please Sign In" href="userloginredir.php?height=220&width=350&deal=3">

当我向页面添加jQuery分页时出现问题，因为页面上显示的结果太多。内部结果的div组件通过ajax load（）事件更新。

以下是分页脚本：

$(document).ready(function(){
    //References
    var pages = $("#menu_deals li");
    var loading = $("#loading_deals");
    var content = $("#content_deals");

    //show loading bar
    function showLoading(){
        loading
            .css({visibility:"visible"})
            .css({opacity:"1"})
            .css({display:"block"})
        ;
    }
    //hide loading bar
    function hideLoading(){
        loading.fadeTo(1000, 0);
    };


    //Manage click events
    pages.live('click',function(){
        //show the loading bar
        showLoading();

        //Highlight current page number
        pages.css({'background-color' : ''});
        $(this).css({'background-color' : 'yellow'});

        //Load content
        var pageNum = this.id;
        var targetUrl = "ajax_search_results.php?page=" + pageNum + "&" + $("#dealsForm").serialize() + " #content_d";
        content.load(targetUrl, hideLoading);
    });

    //default - 1st page
    $("#1").css({'background-color' : 'yellow'});
    var targetUrl = "ajax_search_results.php?page=1&" + $("#dealsForm").serialize() + " #content_d";
    showLoading();
    content.load(targetUrl, hideLoading);
});

当我添加分页（上面的代码）时，厚箱事件不再被识别，而不是弹出一个带有登录表单的窗口，而不是在新页面中打开结果（就像点击普通链接一样）从我的jQuery知识来看，这意味着组件没有在DOM中定义，因为内容在文档准备好触发后更新。

我正在尝试使用以下内容绑定load事件：

content.bind('load', ???);

但是当绑定load事件时，我不知道如何传递load params，targetUrl和回调函数hideLoading。

请帮助我解决这个问题，它已经花了我更多的时间。

Answer 1

tb_init('a.thickbox, area.thickbox, input.thickbox');//pass where to apply thickbox

在ajax的回调中调用它。

Answer 2

您已使用hideLoading函数作为回调函数，而是将其替换为您初始化厚箱并隐藏加载的内容。

content.load(targetURL, function(){ tb_init('a.thickbox'); hideLoading(); });

jQuery绑定ajax load（）事件

2 个答案: