javascript - Return to the previous page after page jump and clear the timer

Question

There is a requirement that when you click on the product, a mask layer will pop up, with a gif waiting for loading in the middle. If the network status is not good and there is no jump after 30 seconds, it will prompt that the current network status is not good. The mask layer disappears after three seconds. I tested it on a real iOS device. When I click on a product, I jump to the product details page. When I click to return to the previous page, the mask layer still exists and it takes 30 seconds to disappear. how to solve this problem

  function Load() {
         var load = document.createElement('p');
         load.className='load_ctn';
         var load_img = document.createElement('img');
         load_img.src="/public/images/loading.gif"
         load_img.className="load_pic";
         load.appendChild(load_img);
         document.body.appendChild(load);
         var timer = setTimeout(function() {
           var network = document.createElement('p');
           network.className="network"; 
           network.innerHTML="您当前网络状态不佳，请稍后再试";
          load.removeChild(load_img);
          load.appendChild(network);
          setTimeout(function() {
              load.parentNode.removeChild(load)
              
          },3000)
         },30000)
     }

 $("a").click(function() {
         Load();
     })

Answer 1

var time = setTimeout(function() {
    load.parentNode.removeChild(load)  
},3000)

//跳到商品详情页的时候移除setTimeout这个定时器
clearTimeout(time)

Answer 2

A simple way is to initialize the page every time you enter the product page. . . This can solve some problems in the shortest time and has minimal side effects