【问题标题】:Fancybox loads php page, NOT on a floating window thoughFancybox 加载 php 页面,而不是在浮动窗口上
【发布时间】:2013-09-05 21:08:12
【问题描述】:

我的目的是在浮动窗口中加载一个 php 页面,该页面将我的用户重定向到 Twitter 以登录,然后通过同一窗口邀请他的关注者。希望fancybox可以处理这个问题。使用下面的代码加载 php 并重定向到 Twitter,但这不是在浮动窗口上发生的,而是在主页本身上发生的。这是我的代码,我错过了什么吗?我尝试了很多其他问题的建议,甚至达到了这一点。

<li onclick="inviteTwitters()">
    <a class="fancyelement fancybox.ajax" href="#" data-id="http://kokas.x10.mx/wp-content/themes/childoftwentytwelve/twitter/redirect.php">
        span>Twitter</span>
    </a>
</li>

function inviteTwitters() { 
    $(".fancyelement").click(); 
}

$('.fancyelement').click(function() {

    var myUrl = $(this).attr('data-id');

    $.fancybox(
        {
            maxWidth    : 800,
            maxHeight   : 600,
            fitToView   : false,
            width       : '70%',
            height      : '70%',
            autoSize    : false,
            closeClick  : false,
            openEffect  : 'none',
            closeEffect : 'none',
            href        : myUrl
             }
        }
    );

    return false;
});

【问题讨论】:

  • 你的页面调试器显示什么样的输出?
  • 这可能有点迂腐,但您是否同时加载了两个 jQuery 库和fancybox 插件as shown here
  • @SuperJer 我不知道你说的页面调试器是什么意思,点击链接重定向到我这里api.twitter.com/oauth/…
  • Chrome 有一个不错的内置调试器,您可以通过按 F12 来使用它。 Firefox 也有一个内置的调试器,但大多数人都会同意它的 Firebug 插件更胜一筹。这些调试器中的任何一个都将能够显示 ajax 调用、网络请求等,包括为每个调试器发送/接收的所有数据。
  • 我在 firebug 上收到此错误:X-Frame-Options 拒绝加载:api.twitter.com/oauth/… 不允许跨域框架。

标签: php redirect fancybox floating


【解决方案1】:

Twitter 可能不喜欢嵌入到 div 中(这本质上是 fancybox 在保留其默认行为时所做的),所以我会尝试将 type : 'iframe' 添加到您的参数列表中。尤其是在 Twitter 实际执行重定向的情况下。

【讨论】:

  • 嘿SuperJer!试过了,不幸的是没有看到任何区别。我正在尝试复制此页面上的功能fancy.com/invite。在该页面中,单击 Twitter 会打开一个指向 Twitter 的弹出窗口。一旦您在那里并登录,弹出窗口就会关闭,控制权会返回到主页,其中会出现一个包含您的关注者列表的花式框。
  • 现在制作一个弹出窗口来引导我到 Twitter 很容易,但是如何关闭弹出窗口并控制返回该站点呢?我无法回答这个问题,所以我想使用 fancybox(感谢您的建议)来处理这两个步骤。
  • 啊,看起来它可能需要在自己的浏览器窗口中弹出。麻烦的是,你失去了对结果窗口的很多控制。我现在了解您要完成的工作,但恐怕我对您的具体问题没有想法。
猜你喜欢
  • 1970-01-01
  • 2012-11-26
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多