在HTML5驗證之前抓取提交

在HTML5驗證步驟之前，有沒有什麼方法可以捕捉表單的submit動作？在HTML5驗證之前抓取提交

HTML

<form method='post' > 
    <fieldset> 
     <input type='email' name='foo' required /> 
     <input type='submit' /> 
    </fieldset> 
</form>

jQuery的

$('form').submit(function() { 
    $('fieldset').addStyle('error'); 
    return false; 
})

但submit一旦HTML5驗證通過時纔會觸發。

你需要HTML5驗證嗎？如果沒有，你可以使用'novalidate'來禁用它。 – 2013-02-28 14:45:41

不，HTML5的驗證發生之前任何提交的事件，在所有的瀏覽器，所以這是不可能的，除了改變了事件的類型，比如按鈕點擊：

$('input[type="submit"]').on('click', function() { 
    $('fieldset').addClass('error'); 
});

2013-02-28 14:48:14 adeneo

+1好主意...... – ManseUK 2013-02-28 14:49:13

酷 - 看起來正是我在找什麼。 – Muleskinner 2013-02-28 14:50:26

實際上你從代碼中遺漏了一些東西。在函數（e）中添加「e」，並在第一行「e.preventDefault;」中添加函數，否則表單將提交。然後，當你準備好在函數'$（'form'）的末尾添加submit（）' – CodeArtist 2013-04-17 22:32:11

當頁面首次加載時，使用jquery禁用表單上的驗證，這樣可以防止在處理程序運行之前發生任何驗證：

$(document).ready(function(){ 
    $('form').attr('novalidate','novalidate'); 
})

，然後在您的onsubmit函數結束，手動（使用checkValidity()）

2013-02-28 14:49:32

改變按鈕從

<input type='submit' />

運行在每個通過javascript字段的HTML5驗證到常規按鈕

<input type='button' id="submit" />

然後，只需捕捉點擊事件並自己提交

$('#submit').on('click', function() { 
    $('fieldset').addStyle('error'); 

    // if everything is ok 
    $('form').submit(); 
})

2013-02-28 14:55:04 vintem

是的，我考慮過這個問題，但因爲它打破了表單的正常行爲而被駁回，例如ENTER不提供默認的默認 – Muleskinner 2013-02-28 14:56:39

回答