為什么onsubmit =“”這么慢？

Question

我首先使用的是：

HTML：

<form onsubmit="return validate()">
    ...
    <input type="submit" id="submit-button"/>
</form>

JS：

function validate() {
    // many lines for a big validation with regex and so on...
    $('form').submit();
}

我注意到，這加載時間很長，因此我將其更改為：

HTML：

<form>
    ...
    <input type="submit" id="submit-button"/>
</form>

JS：

function validate() {
    // many lines for a big validation with regex and so on...
        $('form').submit();
    }

    $('#submit-button').on('click', function(e) {
        e.preventDefault();
        validate();
});

而且加載時間還可以，並且快了約100倍！

有人可以給我一個簡短的答案嗎？

Answer 1

在第一個示例中，您在submit回調中觸發了submit事件，然后調用堆棧超過了[ 請參見小提琴 ]。

第二個示例依賴於click事件，因此一切似乎正常，但是您最好在驗證后通過ajax觸發HTTP調用。

Answer 2

您的函數稱為validate() ，但是我看不到任何驗證，只是一個submit事件。 問題是，設置方式錯誤。 validate()應該返回true/false以便表單知道它是否應該繼續。 因此，您的validate函數應該看起來像這樣：

function validate() {
  //many lines for a big validation with regex and so on...
  if (val=='') { return false; }
  else { return true; }
}

現在，您的表單僅在validate()函數返回true時才提交，否則它將不會繼續。 這將解決您的問題，因此您不會退出。