Question

我有一个登录链接，打开Fancybox并询问用户的用户名/密码。

我将用户输入发送到PHP脚本进行验证，这会在出错时返回错误消息，或者在成功时重定向到主页。

收到错误消息时，我希望在同一个父Fancybox中重新加载错误消息。
成功之后，我希望Fancybox在主窗口中关闭并加载主页。

另一个问题是我的css没有在#fancyboxLogin上加载，但它在$fancybox上加载正常。

HTML：

<a class="fancyboxLogin fancybox.iframe" href="/login">Log In</a>

JavaScript的：

$(document).ready(function () {
    $(".fancybox").fancybox();
});

$(document).ready(function () {
    $(".fancyboxLogin").fancybox({
        type: "iframe",
        afterClose: function () {
            parent.location.reload(true);
        }
    });
});

Answer 1

在html页面中替换

<a class="fancyboxLogin fancybox.iframe" href="/login">Log In</a>

这一行

<a class="fancyboxLogin fancybox.ajax" href="/login">Log In</a>

对于错误消息，您只需使用带有ajax的javascript函数进行验证，并在div标签中显示该消息。

如果验证成功，则只需使用javascript submit（）函数提交表单，该函数提交登录表单并刷新页面。

并且对于javascript fancybox脚本，只需输入：

$(document).ready(function() {
    $(".fancyboxLogin").fancybox({
        maxWidth    : 700,
        maxHeight   : 500,
        fitToView   : false,
        width       : '70%',
        height      : '70%',
        autoSize    : false,
        closeClick  : false,
        openEffect  : 'none',
        closeEffect : 'none'
    });
   });

我希望这可以提供一些帮助

Fancybox - 重新加载页面或加载新页面

1 个答案: