当我尝试从网站的其他页面访问网页时，如何从缓存中获取网页并以表格形式还原数据？

Question

我在网站上有几页的表格。我也有面包屑导航和主导航。从某种意义上讲，主要导航和面包屑非常相似。

但是我想要的是，当我们单击面包屑链接时，将使用我们之前填写​​表格的数据从缓存中转到页面。>]]

F.e。

我有page1，page2，page3。我转到第1页，将一些数据放入表格中。然后转到第2页或第3页。我想从面包屑导航返回到第1页，并查看已放入表单的所有数据。

history.back（）;或history.go（）;在这种情况下不起作用，因为对于这种方法，我们需要丰富层次结构中最后一页的约束逻辑。但就我而言，它是行不通的，因为我同时拥有：复制主菜单的主导航和面包屑（请问问为什么），以及在层次结构中丰富最后一页的逻辑很混乱。

我尝试使用windows.location.reload（）;因为默认情况下，它应该从缓存中重新加载页面。但这是行不通的。也许我用错了方式。或者有另一种方法可以解决此问题。

html

<nav aria-label="breadcrumb">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="page1.url">Page One</a></li>
                <li class="breadcrumb-item"><a href="page2.url">Page Two</a></li>
                <li class="breadcrumb-item active" >Page Thre</li>

            </ol>
</nav>
js
$(window).load(function(){    
        $('.breadcrumb-item a').each(function(index) {
            var link = $(this).prop('href');
            $(this).on("click", function(){
                link = windows.location.reload();
            })            
        });
    });
我在网站上有几页的表格。我也有面包屑导航和主导航。从某种意义上讲，主要导航和面包屑非常相似。但是我想要的是...

Answer 1

我认为您可以同时使用https://api.jquery.com/serializeArray/和https://developer.mozilla.org/fr/docs/Web/API/Window/localStorage将数据作为json保存到本地存储，并在任何页面中检索它们。更改页面时必须执行此操作：

jsonData = $("form").serializeArray()
localStorage.setItem('pageOneData', jsonData);