[HTML] 表单提交与阻止表单提交

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);