无法在 Fancybox iframe 中添加 CSS 类答案

【问题标题】：Unable to add CSS class in Fancybox iframe无法在 Fancybox iframe 中添加 CSS 类
【发布时间】：2013-08-23 05:48:28
【问题描述】：

我正在尝试向 div 添加一个类，该类位于 iframe 以及 Fancybox iframe 中。尝试了几个小时后，我无法让它工作。控制台日志测试打印出来，所以我不确定我做错了什么。这是 Fancybox 1.3.4 版。

jQuery( ".lightbox" ).fancybox( {
    'width'        : '100%',
    'height'       : '90%',
    'transitionIn' : 'none',
    'transitionOut': 'none',
    'type'         : 'iframe',
    onComplete: function() {
        jQuery('#fancybox-frame' ).contents().find('#right_container').addClass('test123');
        jQuery('#right_container').addClass('test321');
            console.log('test');
        }

这是页面：http://www.rescue3international.com/onlinetraining.php

任何帮助将不胜感激。谢谢！

【问题讨论】：

标签： jquery iframe fancybox

【解决方案1】：

不，我收到很多错误/警告。

因此，在您的页面中，内容是使用 iframe 加载的，然后在单击时，fancybox 会加载到另一个 iframe 中。你可以console.log(jQuery('#fancybox-frame'));吗？我在这里不能这样做，因为 iframe url 重定向到父 url。

我认为，您无法获取 iframe 内容，因为警告显示了浏览器显示的安全错误。

Invalid 'X-Frame-Options' header encountered when loading 'http://earthexperience.com/r3/faq': 'GOFORIT' is not a recognized directive. The header will be ignored. 

Blocked a frame with origin "http://www.rescue3international.com" from accessing a frame with origin "http://earthexperience.com". Protocols, domains, and ports must match.

【讨论】：

感谢您的回复。 console.log(jQuery('#fancybox-frame')) 工作：[iframe#fancybox-frame，上下文：文档，选择器：“#fancybox-frame”，构造器：函数，初始化：函数，选择器：“”…] 0: iframe#fancybox-frame 上下文: 文档长度: 1 选择器: "#fancybox-frame" proto: Object[0] X-Frame-Options 是为了让登录/注销可以工作一个 iframe。并且块一帧应该是vimeo播放器。这就是它在 Chrome 控制台中告诉我的内容。谢谢！