如何阻止使用jquery提交動態加載的表單？

Question

我正在使用AJAX登錄系統。現在，當用戶點擊鏈接時，登錄表單會在用戶點擊「登錄」鏈接時動態加載。由於我爲此使用了AJAX，因此我想防止表單在提交按鈕被單擊時實際提交。我嘗試將下面的代碼作爲我的加載函數的一部分，並且表單加載正確，但表單仍然正常提交。

$('#loginBox').load('loginform.php'); 
$('#loginBox form').submit(function(event) { 
event.preventDefault(); 
}); 

我該如何解決這個問題？

Answer 1

jQuery.load是一個異步函數。

這意味着當您嘗試匹配「#loginBox表單」時表單可能無法使用（尚）。 爲了確保在加載表單後執行代碼，您必須將代碼作爲回調函數傳遞以加載。

$('#loginBox').load("form.html", function() { 
    $('#loginBox form').submit(function(event) { 
     event.preventDefault(); 
    }); 
}); 

順便說一句 - 你的情況並不重要無論您使用event.preventDefault（）或返回假。他們都會阻止您的表單被提交。 （見event.preventDefault() vs. return false）

Answer 2

添加返回false防止默認行爲：

$('#loginBox form').submit(function(event) { 
    return false; 
}); 

Answer 3

$('#loginBox form').submit(function(event) { 
return false; 
});