Форма «onsubmit» не вызывался

Question

Вот часть моей формы:

<form name='form-main' onsubmit='return validate()' action='' method='post'> 
    <center><input type='submit' onClick='this.disabled=true; this.form.submit();' value='I accept - Download the GM!'/></center> 
</form> 

и вот validate функция:

function validate() 
{ 
    // this is just to test if it actually shows 
    alert('You must not leave any of the fields blank!'); 
    return false; 
} 

Всякий раз, когда я нажимаю кнопку отправки, ничего не происходит, страница просто reloads .. Мне бы хотелось, чтобы он отображал диалоговое окно предупреждения.

Answer 1

Когда вы звоните в форму submit, событие submit не запускается. Это по дизайну, предполагается, что если вы запускаете представление из кода, вы уже сделали необходимую проверку. (Обратите внимание, что это относится к функции HTMLFormElement#submit, это не обязательно верно для бандеролей библиотек положить вокруг него.)

В вашем примере, я бы удалить click обработчик на кнопку. Это кнопка отправки, поэтому просто поставьте любую соответствующую логику в событии submit на форме. В качестве альтернативы, если хотите, позвоните по номеру validate() в качестве части click.

Answer 2

Событие onclick вашей кнопки отправки запускается непосредственно перед событием onsubmit вашей формы, и это отключает последующие события от распространения и обжига, что приводит к тому, что функция validate никогда не запускается. Вы можете видеть, что вы удаляете this.disabled=true; из своего примера кода.

согласно docs at W3:

Контрольной формы, которая отключена должны предотвратить любые клики события, которые в очереди на источнике задачи взаимодействия с пользователем с отправкой на элемент.

Вы должны удалить код события click из кнопки отправки и просто позволить функции делать то, что вам нужно, в том числе отключить эту кнопку. Например:

function validate() { 
    // this is just to test if it actually shows 
    document.getElementById('sub').disabled=true; 
    alert('You must not leave any of the fields blank!'); 
    return false; 
} 

jsFiddle example

Answer 3

Вы можете изменить оригинальный прототип "представить" метод как это:

HTMLFormElement.prototype._submit = HTMLFormElement.prototype.submit; 

HTMLFormElement.prototype.submit = function(){ 
    this._submit(); 
    alert('Deddy Is Great :)'); // or fire the onsubmit event manually 
};