javascript - 从 php 到没有 history.back() 的 html 页面 div id 的后退按钮

Question

我遇到了两个带有 *.js 的 html 文件之间的连接问题

我有 index.html 我有 formular.php 我有 backbutton.js

我想做的是:如果我通过按钮发送我的公式，我会调用 formular.php 将文本写入我的 MySQL 数据库。如果有人忘记输入电子邮件地址，我会收到一个错误页面，其中有一个“返回”按钮。使用该按钮，我想返回公式页面。

我的问题是我的 index.html 是一个包含 3 个不同 div 的页面，其 ID 分别为 page1、page2、page3。当用户完成测验时，页面本身会从 page1 更改为 page2，并带有

function checkplayer() {
if (player1 == true && player2 == true && player3 == true && player4 == true) {
    setTimeout(function() {
        $(document).ready(function() {
            $("#page1").fadeOut(1000);
            setTimeout(function() {
                $("#page2").fadeIn(1000);
            }, 1500);
        });
    }, 1000);
}

所以我的整个页面只有 1 页，有 3 个淡入和淡出的不同 div。

如果我将 formular.html 中的后退按钮与 history.back(); 一起使用，我会到达 page1 div。但我需要使用公式进入 page3 div。如果我重新加载我的页面，也会发生同样的情况。我总是登陆 page1，因为我的 index.html 以 page1 开头，page2 和 page3 设置为 display: none。这就是为什么我猜回历史在这种情况下不起作用，因为我后退总是意味着新加载的 index.html

我尝试的是制作一个 backbutton.js

function backButton() {

    jQuery("#errorpage").fadeOut(0);
    jQuery("#page3").fadeIn(0);

错误页面淡出但 page3 没有淡入，因为 backbutton.js 不知道 page3 div 所在的 index.html。

有没有可能让errorpage淡出和index.html page3淡入？是否可以将 index.html page3 div“导入”到 backbutton.js 中？

有人知道如何在这 3 个文件之间建立联系，或者是否有任何其他方法可以使错误页面淡出和我的 page3 div 淡入？

感谢任何帮助。谢谢

Answer 1

您可以将散列传递给 URL:

function backButton() {
    jQuery("#errorpage").fadeOut(0);
    window.location = "index.html#page3";
}

然后像这样在原始页面上检查相同的散列:

function checkHash() {
    $(document).ready(function() {
        if (window.location.hash === "#page3") {
            $("#page3").fadeIn(1000);
        }
    });
}

此外，如果未输入电子邮件地址，请考虑不允许用户继续前进。