什麼時候應該加載Ajax代碼？

我在我的網站上使用Ajax提交表單而不重新加載當前頁面。我把代碼放在我的所有Javascript中：在</body>標籤前面。什麼時候應該加載Ajax代碼？

但是我注意到，當我加載一個頁面並在加載結束之前提交一個表單時，頁面會像Ajax那樣重新加載。

這是我的代碼怎麼現在是：

<html> 
    <head></head> 
    <body> 
     <form id="ajaxForm"></form> 
     <script type="text/javascript"> 
      $("#ajaxForm").on("submit", function(e){ 
       $.ajax({}); 
      }); 
     </script> 
    </body> 
</html>

我認爲下面的代碼可以做什麼我做什麼，但我想用選擇（如#ajaxForm）作爲觸發因素執行Ajax。

<html> 
    <head> 
     <script type="text/javascript"> 
      function submitForm(){ 
       $.ajax({}); 
      } 
     </script> 
    </head> 
    <body> 
     <form id="ajaxForm" onsubmit="submitForm()"></form>    
    </body> 
</html>

我應該如何安排我的代碼正確使用Ajax，即使頁面加載尚未完成？

來源

2016-03-08 user3595786

第一個是好的（就在''標籤之前），如果表單出現在腳本之前，則不應該有任何問題。您可以嘗試在文檔準備函數'$（function（）{/ * code here * /}）;'中包裝整個事物。編輯：你可以嘗試設置onsubmit爲表單返回false以防止默認提交... –

用戶在頁面加載完成之前如何提交表單？ – Barmar

當表單提交按鈕被加載時，我可以點擊它，因此如果沒有采取任何行動來阻止，表單將被提交。 – user3595786

我做了什麼，馬克建議：

<html> 
    <head></head> 
    <body> 
     <form id="ajaxForm" onsubmit="return false;"></form> 
     <script type="text/javascript"> 
      $("#ajaxForm").on("submit", function(e){ 
       e.preventDefault(); 
       $.ajax({}); 
      }); 
     </script> 
    </body> 
</html>

的「的onsubmit =」返回false;」「將阻止經典隨時提交。這就是我需要的。「e.preventDefault（）;」單獨是不夠的，尤其是當它被加載到主體的末尾時。

來源

2016-03-18 08:30:49 user3595786

我相信你需要防止表單提交的默認行爲。

您可以通過添加e.preventDefault();到您的第一個腳本實現這一點：

$("#ajaxForm").on("submit", function(e){ 
    e.preventDefault(); 
    $.ajax({}); 
});

來源

2016-03-08 23:19:50

不幸的是，當這個腳本放在主體的末尾時，它也會在HTML之後加載。當頁面被加載時（以及當HTML的上半部分被加載時，而不是包含腳本的下半部分）發生了什麼，並且我單擊了提交表單按鈕，表單仍然會正常提交。 onsubmit =「返回false;」將阻止在加載表單的HTML時立即提交。 – user3595786

什麼時候應該加載Ajax代碼？

回答

相關問題