有两个html页面.当我从下一页恢复到第一页时，我希望保存第一页的数据状态

there are two html pages. I want the data status of first pages to saved when I reverting from next page to first page

本文关键字：第一页恢复我希望状态数据保存一页两个 html 页面更新时间：2023-09-26

当我单击下一页的后退按钮时，复选框值不应重置。

它应该和我检查或未检查的一样。下面是第一页和下一页的代码。

第一页

<!DOCTYPE html>
    <html>
        <body>
            <form>
                <input type="checkbox" name="code" value="ECE">ECE<br>
                <input type="checkbox"  name="code" value="CSE">CSE<br>
                <input type="checkbox"  name="code" value="ISE">ISE<br>
                <br>
                <input type="button" onclick="dropFunction()" value="save">
                <br><br>
                <script>
                    function dropFunction() {
                        var branch = document.getElementsByName("code");
                        var out = "";
                        for (var i = 0; i < branch.length; i++) {
                            if (branch[i].checked == true) {
                                out = out + branch[i].value + " ";
                                window.location.href="next.html";
                            }
                        }
                    }
            </script>
        </form>
    </body>
</html>

<html>
    <head>
        <title>Welcome to </title>
    </head>
    <body color="yellow" text="blue">
        <h1>welcome to page</h1>
        <h2>here we go </h2>
        <p> hello everybody<br></p>
        </body>
        <image src="D:'images.jpg" width="300" height="200"><br>
        <button onclick="goBack()">Go Back</button>
        <script>
        function goBack() {
            window.location.href="first.html";
        }
        </script>
    </body>
</html>

完整解决方案：示例。首先将id添加到您的复选框中：

    <input type="checkbox" name="code" value="ECE" id='1'>ECE<br>
    <input type="checkbox"  name="code" value="CSE" id='2'>CSE<br>
    <input type="checkbox"  name="code" value="ISE" id='3'>ISE<br>
    <input id="spy"  style="visibility:hidden"/>

然后更改您的dropFunction：

function dropFunction() {
    var branch = document.getElementsByName("code");
    var out = "";
    localStorage.clear();
    for (var i = 0; i < branch.length; i++)
        if (branch[i].checked == true)     
            localStorage.setItem(branch[i].id, true);
    for (var i = 0; i < branch.length; i++) {
        if (branch[i].checked == true) {
            out = out + branch[i].value + " ";
            window.location.href="next.html";    
        }
    }
}

并在first.html中添加一些新的javascript代码：

window.onload = function() {                  
     var spy = document.getElementById("spy");
     if(spy.value=='visited')
         for(var i=1;i<=3;i++)
             if(localStorage.getItem(i))
                document.getElementById(i).checked=true;
     spy.value = 'visited';                            
}