Question

关注this question，我一直在尝试使用colorbox加载部分页面。我的代码看起来像这样。我有一个包含大量内容的网页，但也包含一个ID为id的特定div：

<html>
<body>
...
<div id="colorboxcontent">...</div>
</body>
</html>

然后我尝试使用colorbox加载页面的部分，如下所示：

$('a').colorbox({
  href: $(this).attr('href') + ' #colorboxcontent'
});

根据上面链接的问题/答案，这应该有效，因为colorbox使用jquery ajax加载方法，这使得可以拉入页面的特定部分。然而，这对我不起作用。我收到一条错误，指出内容无法加载。

有谁知道我可能做错了什么？

Answer 1

我非常确定您可以使用href代替html并直接加载所述div标记的内容。

编辑：你可以在页面上有一个隐藏的div来处理＆＃39;下面的Ajax：

 $.ajax({
    type: "GET",
    url: "[your_page_url]",
    success: function (data, textStatus, jqXHR) {
        var htmlData = $.parseHTML(data);
        $("#myhiddendiv").html(htmlData);

        //now your original div exists on the page
        $('a').colorbox({
            html: $("#colorboxcontent").html();
        });

        //if you want to you could clear that temp div now
        $("myhiddendiv").html("");
    }
 });

希望有所帮助。

Answer 2

我在Colorbox的问题跟踪器上回复了您的问题，但是在这里回复了SO人员。我认为你发布的内容看起来很好，所以我目前的印象是有一个不相关的问题阻碍了它的运作：

这可能是一个无关的JS错误或无效的标记。

我的猜测是您正在测试的页面不是由服务器托管的。该网站需要由http服务器托管，以便ajax调用正常工作，而不是仅仅在浏览器中打开html文件。

是否可以使用colorbox仅加载部分页面？

2 个答案: