如何在我的应用程序中正确使用厚盒？

Question

我有几个关于厚盒的问题。我正在开发一个需要在主页上显示几个厚框以在不同时间显示的网站。当显示thickboxes时，它会触发一个API调用并在thickbox中显示反馈。

我决定使用内联显示厚框来减少 Ajax 调用的数量。看起来很简单，但出现了几个问题。第一个是在显示thickbox 时删除包含thickbox 内容的div。 Thickbox 将 HTML 替换为自定义 HTML 以正确显示内容。这没关系，但是当我希望我的 AJAX 响应更新厚箱内的某些内容并且我将其设置为通过选择它的容器 ID 来访问厚箱时，这是有问题的。那不再可用了。当然，我可以为响应指定唯一标识符，但我只是希望给它们所有类“响应”并根据包含 DIV 的外部选择它们。 $("#login_lightbox > .response").html(ajax_response);这有意义吗？

我的另一个担忧是，也许有更好的方法来处理厚盒。我是否应该进行 AJAX 调用以获取厚盒内容，然后在加载时进行 API 调用？这对我来说似乎不是一个好的选择，但以前的开发人员是这样设置的，所以我希望能得到一些意见。

Answer 1

为了打开新的 Ajax 内容 一个打开的 Ajax ThickBox，它的代码必须 还包含适当的 HTML (class="thickbox") 启动 Ajax 厚盒（参见演示示例）。

您可能想在http://jquery.com/demo/thickbox/#sectionf-1 阅读和查看演示

HTH

编辑：

嘿，托尼，以上内容适用于厚盒内的新内容链接，不适用于打开厚盒。要使用上面的演示页面，初始内容包含一个链接：

<p>What is jquery? <a href="newTBcontent.html?height=200&amp;width=300" class="thickbox">Answer</a></p>

以便将内容加载到厚盒中。

为了解决您的问题，当我执行以下操作时，效果很好。也许我误解了你的问题？

初始页面上的某处：

<p><a href="atb.php?height=200&amp;width=300" class="thickbox">Open AJAX Thickbox</a></p>

Thickbox 内容（文件'atb.php'）：

<script language="javascript" type="text/javascript">
jQuery(document).ready( function()
{
    jQuery.ajax(
    {
        type: "GET",
        url: "atbd.php",
        success: function(rsp)
        {
            jQuery( ".response" ).html(rsp);
        }
    });
});
</script>
<div id="container">
    <div class="response">RSP 1</div>
    <div class="response">RSP 2</div>
    <div class="response">RSP 3</div>
    <div class="response">RSP 4</div>
</div>

文件'atbd.php'：

<?php
echo date('Y-m-d H:i:s', time());
?>