0

首先让我说我是使用 Ajax 的新手。我正在尝试通过 ajax 加载内容并将其显示在当用户单击链接时启动的颜色框弹出窗口中。这是我到目前为止所拥有的，但我什至无法打开 Colorbox。有没有人有任何见解可以使这种事情发挥作用？谢谢！

$(document).ready(function(){
$(".show-overlay-link").click(function() {
  // get facet name from value of @id
  var id = $(this).attr("id");
  var facetName = id.replace(/^show-overlay-link-/, "");
  $.colorbox({href:"/ajax.xqy?action=facet&name=" + facetName});
  });
});
4

1 回答 1

1

首先，这不是ajax ...

其次，即使没有 ajax，问题也出在您的颜色框配置中，因为您将 URL 传递给颜色框，而没有为 URL 提供一个可存放的位置，例如 iframe。您需要首先编写一个构造函数来为常规帖子构建查询 URL，然后扩展您的 colorbox 属性以包含 colorbox iframe 属性，如下所示。

$(document).ready(function(){
    $(".show-overlay-link").click(function() {

        // get facet name from value of @id
        var id = $(this).attr("id");

        // modify the returned id to remove the unwanted part of the id
        // for use in the query constructor
        var facetName = id.replace(/^show-overlay-link-/, "");

        // build a query constructor for your query URL
        var facetQuery = '/ajax.xqy?action=facet&name=' + facetName;

        // Configure colorbox with the iframe property set to true to give your
        // query response a target for the returned query result page.
        $.colorbox({
            iframe: true,
            href: facetQuery
        });
    });
});

我无法在没有看到服务器端脚本以及它如何处理发送给它的发布数据以及知道处理在 ajax 响应中发回的返回数据的类型的情况下向您展示如何使用 ajax 执行此操作（即json、xml、html、文本等）。但是，提供的代码仍应使用现有代码在客户端和服务器端完成您希望的工作。

此外，重要的是要注意您使用的是相对 URL 而不是绝对 URL 用于 facetQuery，这将相对于您的 colorbox.js 所在的位置，因为它是从 colorbox 本身内部调用的，并且没有其他引用路径而不是它自己的位置。最好为构造函数使用绝对 URL，因为它不会与 colorbox.js 在服务器上的存储位置相关。

希望有帮助。

于 2013-09-06T22:47:35.990 回答