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

Question

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

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

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

Answer 1

In order to open new Ajax content in an open Ajax ThickBox, its code must also contain the appropriate HTML (class="thickbox") to launch an Ajax ThickBox (see demo for example).

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

HTH

编辑:

嘿托尼，以上内容适用于 Thickbox 中的新内容链接，而不是打开 Thickbox。为了配合上面的演示页面，初始内容包含一个链接:

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

以便将内容加载到 Thickbox 中。

为了回答你的问题，当我执行以下操作时，效果非常好。也许我误解了你的问题？

初始页面上的某个位置:

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

厚盒内容(文件“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());
?>