頁面上的Javascript ajax調用onload

我希望頁面在發出ajax調用來更新數據庫之前完全加載。我可以在正文onload事件中調用javascript函數，以便頁面完全加載，但我不確定如何從那裏觸發Ajax調用。是否有更好的方法來實現此目的（頁面加載後的Upadating數據庫）？頁面上的Javascript ajax調用onload

來源

2010-11-10 Hector Barbossa

數據庫更新與onload頁面事件嚴格相關？或者它可以在服務器開始發送頁面時執行？ – 2010-11-10 13:22:41

使用JavaScript庫（例如，使用jQuery你可以寫：

$(document).ready(function(){ 
$.ajax({ url: "database/update.html", 
     context: document.body, 
     success: function(){ 
      alert("done"); 
     }}); 
});

沒有jQuery的，最簡單的版本可能是如下，但它沒有考慮瀏覽器的差異或錯誤處理：

<html> 
    <body onload="updateDB();"> 
    </body> 
    <script language="javascript"> 
    function updateDB() { 
     var xhr = new XMLHttpRequest(); 
     xhr.open("POST", "database/update.html", true); 
     xhr.send(null); 
     /* ignore result */ 
    } 
    </script> 
</html>

參見：

來源

2010-11-10 13:13:43 Eero

雅這很好，但我可以做到這一點，而不使用jQuery？ – 2010-11-10 13:28:39

'$ .ready'等同於'DOMContentLoaded'而不是'load'。您的jquery/vanilla比較可能會誤導這一點。你的香草版本應該使用'document.addEventListener'來監聽事件，而不是'onload'屬性，這被認爲是一種非常糟糕的做法。 – ngryman 2016-11-24 14:44:38

僅供參考：棄用聲明：從jQuery 3.0開始，將刪除jqXHR.success（），jqXHR.error（）和jqXHR.complete（）回調。您可以使用jqXHR.done（），jqXHR.fail（）和jqXHR.always（）來代替。 – mmv1219 2017-07-27 17:07:08

您可以使用jQuery爲您做到這一點。

$(document).ready(function() { 
    // put Ajax here. 
});

檢查在這裏：

http://docs.jquery.com/Tutorials:Introducing_%24%28document%29.ready%28%29

來源

2010-11-10 13:19:19 Trecenti

或者與原型：

Event.observe(this, 'load', function() { new Ajax.Request(...));

或者更好的，定義函數的其他地方，而不是內聯，則：

Event.observe(this, 'load', functionName);

您不必專門使用jQuery或Prototype，但我希望您使用某種類型的庫。任何一個庫都將以比onload更一致的方式處理事件處理，當然，這將使處理Ajax調用變得更容易。如果您必須使用body onload屬性，那麼您應該只能調用與這些示例中引用的相同的函數（onload="javascript:functionName();"）。

但是，如果您的數據庫更新不依賴於頁面上的呈現，爲什麼要等到它完全加載？您可以在頁面上的JavaScript末尾包含對Ajax調用函數的調用，這應該會產生幾乎相同的效果。

來源

2010-11-10 14:32:41 JST

頁面上的Javascript ajax調用onload

回答

相關問題