fancybox iframe内容未通过jquery函数显示

fancybox iframe content not showing through a jquery function

本文关键字：jquery 函数 显示 iframe fancybox      更新时间：2023-09-26

下面是我在jquery函数中的代码：

$("form").submit(function() {

    if(form.First_Name.value == ""){
        alert("Please fill in your First Name.");
        form.First_Name.focus();
        return false;
    }
    if(form.Last_Name.value == ""){
        alert("Please fill in your Last Name.");
        form.Last_Name.focus();
        return false;
    }
    if(form.Customer_eMail952.value == ""){
        alert("Please fill in your Email.");
        form.Customer_eMail952.focus();
        return false;
    }else{
        if (!/^([a-zA-Z0-9_'.'-])+'@(([a-zA-Z0-9'-])+'.)+([a-zA-Z0-9]{2,4})+$/.test(form.Customer_eMail952.value)) {
            alert("Invalid Email");
            form.Customer_eMail952.focus();
            return false;
        }
    }
    var submittedURL = 'http://www.google.com';
    $.fancybox.open({'href': submittedURL, 'type': 'iframe'});
});

该函数将在没有任何错误的情况下运行，但当显示iframe时，它不会显示其中的任何内容。使用FireBug，它将显示正确的href:

<iframe class="fancybox-iframe" scrolling="auto" frameborder="0" src="http://www.google.com" hspace="0" name="fancybox-frame1331232022953">

我使用的是fancybox 2.0，在调用此函数时，fancybox已经打开。它是在表单验证后调用的。

为什么Iframe没有加载？我做错了什么？

我找到了一个解决方案，我无法让fancybox工作，所以我查询了它。

我替换了这个代码：

var submittedURL = 'http://www.google.com';
$.fancybox.open({'href': submittedURL, 'type': 'iframe'});

使用此代码：

$(".fancybox-inner").empty();
$(".fancybox-inner").append('<iframe src="'+submittedURL+'" class="fancybox-iframe" scrolling="auto" frameborder="0" hspace="0" />');
$.fancybox.update();

我知道这是一个蹩脚的破解，但它有效。

谷歌和其他知名网页（脸书、雅虎等）大多使用X-Frame响应标头来避免点击劫持攻击（在iframe中打开时可能会发生这种情况）。谷歌增加了这个选项也是因为他们的adSense程序政策发生了变化。

查看以下链接了解更多信息：

https://stackoverflow.com/a/8808761/1055987

https://developer.mozilla.org/en/The_X-FRAME-OPTIONS_response_header

不过，你可以打开自己域的其他页面。

相关文章：