1. submit按钮
<input type="submit">
按钮不在<form></form>
中不会提交表单。
2. <button>
按钮
<button>text<button>
相当于submit按钮,在<form></form>
中点击,会提交表单。
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);