1

我有两个表格,我正在尝试同时提交它们。一个是发布到我们的 PHP 框架,另一个是发布到外部系统(prestashop 安装),这似乎要求用户通过表单的正常单击提交来“访问”页面以处理表单。

我的解决方案是,在发射另一种形式后发射一种形式

$(document).ready(function() {
    $('#loginForm2').hide(1);
    $("#loginButton").click(function() {
        $("#userEmail2").val($("#userEmail").val());
        $("#userPassword2").val($("#userPassword").val());
        $.post(
            $("#loginForm").attr("action"), $("#loginForm").serialize(), function(data) {
                // alert('posted to users/login successfully');
                $("#SubmitLogin").click();
            }
        );
        return false;
    });
    function refresh() {
        location.reload();
    }
});

#loginForm2 表单被发送到同一页面上的隐藏 iframe,并且 iframe 在加载页面(并登录用户)后刷新。

<iframe id="loginIframe" style="display:none;" onload="refresh();"></iframe>

这在 Chrome 和 Safari 中效果很好,但在 Firefox 中,它将 iframe 视为弹出窗口并且不会这样做(除非用户说允许弹出窗口)。

有没有办法绕过 Firefox 认为这个 iframe 是一个弹出窗口?我明白它为什么这样做;这不是用户点击的真实事件,它是来自 jquery 的假鼠标点击。我已经查找了一些解决方案来尝试触发“真实”的鼠标点击,但没有发现任何似乎有效的方法。

4

1 回答 1

2

这是解决方案:

使您单击外部系统(prestashop)表单的提交按钮而不是主系统的登录按钮(使用 CSS 隐藏主系统并显示外部系统)。然后这样做:

    $("#SubmitLogin").click(function() {
        var loaded = 0;
        $("#userEmail2").val($("#userEmail").val());
        $("#userPassword2").val($("#userPassword").val());
        $.post(
            $("#loginForm").attr("action"), $("#loginForm").serialize(), function(data) {
                loaded++;
                if (loaded > 1) {
                    location.reload();
                }
            }
        );
        $('#loginIframe').load(function() {
            loaded++;
            if (loaded > 1) {
                location.reload();
            }
        });
    });

加载的变量是为了确保如果prestashop窗口在主登录的序列化数据发送之前加载,它不会在没有完成主登录的情况下刷新。

显然,iframe 看起来像这样

<iframe id="loginIframe" name="loginIframe" style="display:none;"></iframe>

在 Chrome Firefox 和 Safari 中测试。

于 2013-04-26T18:38:13.087 回答