JavaScript表单提交总结

提交表单
3种实现方式：

submit form 只要表单存在以上任何一种按钮且获得焦点时都可以通过回车提交表单，（textarea会换行），即触发submit事件，可在其中验证表单，或阻止提交，利用e.preventDefault(); 也可以通过form.submit()方式提交表单，但这种方式不会触发submit事件，因此要提前验证表单。 重置表单 input 和button两种按钮实现，可用form.reset重置表单，同时出发onreset事件。

form.elements获取表单name
var form = document.forms[0];
form.elements[0];//获取第一个表单字段
form.elements[‘miao’];
//获取名为miao的字段，若是radio，会返回NodeList包含所有的同名name字段。

共有的表单属性
disable 是否禁用
form 指向当前字段所所属表单
name 表单字段名称
readOnly 字段是否只读
tabIndex tab切换序号
type 类型
value 提交给服务器的值
防止重复提交表单
第一次点击提交后就将其disable置为true

var submit = document.forms[0]['submit']; submit.onsubmit = function(){ submit.disabled = true; //提交给 } 若上面用onclick提交表单，有的浏览器会先触发click事件，若在click事件中禁用submit按钮则导致表但不能正常提交。

var submit = document.getElementById(‘submit’);
submit.onclick = function () {
alert(‘click’);
submit.disabled = true;
};
document.forms[0].onsubmit = function () {
alert(‘submit’);
};
以上代码在Chrome和Opera中测试时发现，在click事件中禁用表单按钮后不能再触发onsubmit事件，但是IE11、ff下都能提交。

change事件
对于input和textarea元素，仅当失去焦点且value值改变时触发，select元素在选项改变时触发。

change事件和focus、blur事件一起验证用户输入：

• focus 改变文本框的颜色
• blur 恢复文本框颜色
• change 验证用户输入是否合法，不合法的话重新focus

propertychange事件和input事件
input事件：元素value值发生改变时触发，IE11或其他
propertychange事件：元素属性改变时触发，IE10，9专属。
IE11已经不支持attachEvent添加事件了
为表单元素添加的事件通过js改变value值后不能触发
为input添加change或者input事件后，只能通过页面手动改变value值后才能触发添加的回调函数，而通过js改变value值并不能触发。可将input的监听事件中要实现的功能封装成独立的方法，在js改变input元素值后继续调用此方法即可。