如何在通過Ajax提交之前在表單上使用瀏覽器驗證？

Question

使用帶有新類型（email，url等）的HTML5表單，我用JS函數綁定了submit事件。

問題是，瀏覽器先調用這個函數，然後調用它的驗證系統，但是只有在提交函數沒有返回false。

或者，我做了Ajax請求和該函數中的所有工作，這意味着我總是返回false。

如何在調用js函數之前啓用瀏覽器驗證？

感謝您的幫助。

Answer 1

從規範中，瀏覽器應首先驗證表單，然後，如果表單有效，則應觸發提交事件。這意味着，您應該能夠在提交事件中進行Ajax提交。

當前Opera首先啓動提交事件，然後進行驗證。你可以簡單地手動調用驗證您提交監聽器內，用checkValidity法：

$(form).bind('submit', function(){ 
    if(!this.checkValidity || this.checkValidity()){ 
     //do ajax and return false 
    } 
}); 

注：這可以doubble在這些瀏覽器無效的事件，太多。如果你不使用它們，evrything應該沒問題。如果你想使用它們，並且不想讓它們翻倍，你可以使用webshims lib，它可以在不同的瀏覽器中解決這個問題和其他問題。