jQuery 弹出窗口 (bPopup) 无法加载 iFrame答案

【问题标题】：jQuery popup (bPopup) fails to load iFramejQuery 弹出窗口 (bPopup) 无法加载 iFrame
【发布时间】：2014-09-20 21:19:11
【问题描述】：

我创建了一个使用 jQuery 插件加载 .php 站点的弹出窗口：bpopup。

问题是插件不会加载用 php 编码的网站。谁能告诉我问题出在哪里？

这是我正在使用的代码：

JavaScript：

$('#leader').bind('click', function (e) {
    // Prevents the default action to be triggered. 
    e.preventDefault();
    // Triggering bPopup when click event is fired
    $('#leaderboard').bPopup({
        modalClose: false,
        opacity: '0',
        positionStyle: 'fixed', //'fixed' or 'absolute'
        content: 'iframe', //'ajax', 'iframe' or 'image'
        contentContainer: '.content',
        loadUrl: 'http://remake.hr/memtest/leaderboard.php' //Uses jQuery.load()
    });
});

HTML：

<div id="leaderboard" class="info"></div>
<div class="button" id="leader"></div>

CSS：

.info {
    display:none;
    width:700px;
    background: rgb(38, 170, 225);
    /* Fall-back for browsers that don't support rgba */
    background: rgba(38, 170, 225, .9);
    color:white;
    line-height: 35px;
    padding: 25px 50px 50px 25px;
}

【问题讨论】：

你能提供你的代码的jsfiddle吗？还要确认您正在检查本地主机或服务器..
我不熟悉bpopup，但我认为loadUrl 属性以某种方式使用jQuery.load()？如果是这种情况，它不应该有complete, error, && success 的回调吗？如果是这样，你能不能将它们与开发人员工具结合使用来查找问题？我觉得这是一个ajax问题。要么你的 php 没有返回预期的 STRING，要么 ajax 没有正确建立以期望你返回的内容。您是否使用 echo 返回 HTML STRING？
另外，正如 Jeroen 指出的那样，contentContainer: '.content', 与我们能看到的任何东西都没有关联。

标签： javascript php jquery html iframe

【解决方案1】：

使用class="content"向您的HTML添加一个内部div标签

使用contentContainer: '.content'，您可以指定此容器。

生成的 HTML：

<div id="leaderboard" class="info"><div class="content"></div></div>
<div class="button" id="leader"></div>

【讨论】：

大声笑完全看过了。正在看这个插件的东西。我已经习惯了在需要的时候自己写，所以这些插件问题总是让我有点困惑。
+1 是的我也是.. 一些调整，你应该都设置好了@user2496520
感谢代码@JeroenNoten。现在效果很好！