html submit 提交无效,[HTML] 表单提交与阻止表单提交

1. submit按钮

按钮不在

中不会提交表单。

2. 按钮

text相当于submit按钮，在中点击，会提交表单。

3. 阻止submit默认事件

submit按钮click事件中的e.preventDefault();会阻止submit按钮提交表单。

document.querySelector('#button1').addEventListener('click',function(e){

e.preventDefault();

},false);

4. 阻止form默认事件

form的submit事件中e.preventDefault();会阻止表单提交。

document.querySelector('#form1').addEventListener('submit',function(e){

e.preventDefault();

},false);

5. 让submit按钮disabled

(1)点击前让按钮disabled会导致click事件不触发。

document.querySelector('#button1').setAttribute('disabled',true);

(2)submit按钮的click事件中disable按钮，会阻止表单提交。

document.querySelector('#button1').addEventListener('click',function(){

var button=this;

button.setAttribute('disabled',true);

},false);

注：

document.querySelector('#button1').addEventListener('click',function(){

var button=this;

button.setAttribute('disabled',true);

//仍然会阻止表单提交

setTimeout(function(){

button.removeAttribute('disabled');

},0);

},false);