How to get the web pages from cache and restore data in the forms when i try to reach them from other pages of my site?

I have several pages with forms on my website. And I also have breadcrumbs navigation and main navigation. In some sense, the main navigation and breadcrumbs are very similar.

But what I want is when we click on breadcrumbs links we go to the pages from cache with data that we filled in forms before.

F.e.

I have page1, page2, page3. I go to page1, put some data in a form. Then go to page2 or page3. And I want to go back to page1 from my breadcrumbs navigation and see all the data that I've already put in the form.

history.back(); or history.go(); don't work in this case, because for this method we need the strait logic of riching the last page in the hierarchy. But in my case, it doesn't work, because I have both: main navigation and breadcrumbs that duplicating it (pls don't ask why), and the logic of riching the last page in the hierarchy can be chaotic.

I've tried to use windows.location.reload(); because by default, it should reload a page from the cache. But it doesn't work. Maybe I use it in the wrong way. Or there is another way to solve this problem.

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();
            })            
        });
    });