如何在頁面刷新後延遲javascript函數執行？

作爲JavaScript新手，我需要從sessionStorage中檢索數據，並在父輸入刷新後填充父輸入表單以更新某些子記錄。我可以調用函數來刷新頁面和函數以獨立地從sessionStorage獲取數據，但我一直無法合併這些過程，以便a）頁面完全重新加載，然後b）從sessionStorage中檢索數據在頁面重新加載之後。如何做到這一點？如何在頁面刷新後延遲javascript函數執行？

我的頁面刷新（與嘗試要結合使用的setTimeout方法的功能），代碼如下：

<script> 
function refreshPage() { 
location.reload(); 
setTimeout(GetSessionData, 4000); 
} 
</script>

我的函數來獲取數據出來的sessionStorage如下：

<script> 
var inputcollection = document.getElementsByTagName("input"); 

function GetSessionData() { 
    for (var i = 0; i &lt; inputcollection.length; i++) { 
    if(document.getElementById(inputcollection[i].name) != null || document.getElementById(inputcollection[i].name) != undefined) { 
    console.log(i + " " + inputcollection[i].name + "-" + inputcollection [i].value + "-"); 
    if(document.getElementById(inputcollection[i].name).type != "file"){ 
    document.getElementById(inputcollection[i].name).value = sessionStorage.getItem(inputcollection[i].name); 
    }}} 
</script>

來源

2017-07-28 DGassaway

人們不能....頁面將重新加載，任何後不會跑步。 – epascarello

喲在refreshPage（）函數內部它會執行前面的指令，以便刷新頁面location.reload（），所以它會刷新頁面，由於頁面重新加載而停止函數執行，並且下面的代碼掛起從不執行。

您應該在執行GetSessionData（）函數之後執行頁面刷新/加載文檔正文的加載事件並將其從刷新中刪除。

<html> 
    <head>  
    <!--Many things --> 
    <script> 
    function refreshPage() { 
     location.reload(); 
    } 
    </script> 
    </head> 
    <body onload="GetSessionData()"> 
    <!-- Your body code --> 
    </body> 
</html>

如果你想用setTimeout函數添加的延遲，你應該把到另一個函數或內部GetSessionData

function GetSessionData() { 
    setTimeOut(function(){ 
     for (var i = 0; i < inputcollection.length; i++) { 
      if(document.getElementById(inputcollection[i].name) != null || 
      document.getElementById(inputcollection[i].name) != undefined) { 
       console.log(i + " " + inputcollection[i].name + "-" + 
       inputcollection [i].value + "-"); 
       if(document.getElementById(inputcollection[i].name).type != "file"){ 
        document.getElementById(inputcollection[i].name).value = sessionStorage.getItem(inputcollection[i].name); 
       } 
      } 
     } 
     },4000); 
    }

來源

2017-07-28 22:25:24 jmtalarn

感謝您的解釋 - 這是非常有用的 – DGassaway

你可以做這樣的事情：當你正在執行

<script> 

    //Declare your function 
    function GetSessionData() { 
     for (var i = 0; i &lt; inputcollection.length; i++) { 
      if(document.getElementById(inputcollection[i].name) != null || document.getElementById(inputcollection[i].name) != undefined) { 
       console.log(i + " " + inputcollection[i].name + "-" + inputcollection [i].value + "-"); 
       if(document.getElementById(inputcollection[i].name).type != "file"){ 
        document.getElementById(inputcollection[i].name).value = sessionStorage.getItem(inputcollection[i].name); 
       } 
      } 
     } 
    } 
    //When the page is loaded (or reloaded in your case), set theTimeout which will call the GetSessionData, 
    document.addEventListener("DOMContentLoaded", function(event) { 
     setTimeout(GetSessionData, 4000); 
    }); 

    //Declaring your refresh function 
    function refreshPage() { 
     location.reload(); 
    } 
</script>

來源

2017-07-28 22:19:59 Superdrac

感謝您的代碼建議 – DGassaway

如何在頁面刷新後延遲javascript函數執行？

回答

相關問題