Question

我有这个：

$("a.money").colorbox({href:$("a.money").attr("href")+" div#content"});

这会打开覆盖，但只会打开#content选择器中的内容。如果我添加iframe：true，这将不再有效。有没有办法让它与iframe一起使用？

修改最接近我可以通过这样做：

$("a.money").colorbox({iframe:true, width:700, height:425,
    onComplete: function() {
        alert('test');
        $test = $("#cboxLoadedContent iframe").contents().find("#content").html();
        $("#cboxLoadedContent iframe").contents().find("#container").html($test);
    } 
});

虽然没有警报它似乎不起作用，但我调查了一下，我想我需要使用.live（），这导致我尝试这个：

$('a.money').live('click', function() { 
    url = this.href; // this is the url of the element event is triggered from
    $.fn.colorbox({href: url, iframe:true,width:700, height:425,
        onComplete: function() {
            $test = $("#cboxLoadedContent iframe").contents().find("#content").html();
            $("#cboxLoadedContent iframe").contents().find("#container").html($test);
        } 
    });
    return false;
});

无法正常工作，我仍然需要添加警报以使其正常工作。

如果您可能想知道我想要做什么。网页加载到iframe中，其中包含#container中的所有元素，因此包含＃header，＃sidebars，但我只想在iframe中显示#content。然而，这让我意识到另一个问题。假设我在没有警报的情况下使用它，它只适用于该初始页面。例如，如果我在iframe中加载了一个表单，在提交表单后，我会再次看到整个布局而不仅仅是#content部分。是否可以继续仅在进一步导航时显示页面的#content部分？

Answer 1

您的初始代码在没有警报的情况下无法正常工作的原因是因为除了需要“onComplete”功能外，还需要iframe上的加载事件。警报为iframe提供了加载时间，使您的代码正确呈现。

所以，它应该看起来像：

$("a.money").colorbox({iframe:true, width:700, height:425,
    onComplete: function() {
        $("#cboxLoadedContent iframe").load(function(){
              $test = $(this).contents().find("#content").html();
              $(this).contents().find("#container").html($test);
    });
    } 
});

Answer 2

这应该有用。

  $("a.money").colorbox({ href:"#content", inline: true, iframe: true });
  <div id='content'>Any content here</div>
  <a class='money' href="#">question</a>

Answer 3

我根据这些主题中的代码找到了另一种解决方案：

http://groups.google.com/group/colorbox/browse_thread/thread/9a54137b8cae96c5/11d37ea7ab72562f http://groups.google.com/group/colorbox/browse_thread/thread/8a0deec97202e27c/2e7524b87931a89e

它不使用iframe，但它或多或少都是我想要的。

jQuery Colorbox Iframe和Selector

3 个答案: