type='submit' 提交按钮,默认点击后触发的是表单的submit事件,提交其所属的表单
type='button' 一般按钮,默认点击后触发的是click事件,具体点击后进行什么样的操作,需要自己通过js代码来实现
思路:本题要想实现用javascript做出重置效果需要用到JavaScript实现重置表单(reset)的方法。
例子:
<form id="form1"><input type="text" id="name"/>
<input type="button" value="这个用JavaScript清除" onclick="document.getElementById('form1').reset()"/>
<input type="reset" value="这个是Form清除" />//reset()重置
</form>
JS清空表单有二种方法:遍历和reset;分别如下:
方法1:遍历页面元素
/*
清空FORM表单内容 id:表单ID*/
function ClearForm(id) {
var objId = document.getElementById(id)
if (objId == undefined) {
return
}
for (var i = 0i <objId.elements.lengthi++) {
if (objId.elements[i].type == "text") {
objId.elements[i].value = ""
}
else if (objId.elements[i].type == "password") {
objId.elements[i].value = ""
}
else if (objId.elements[i].type == "radio") {
objId.elements[i].checked = false
}
else if (objId.elements[i].type == "checkbox") {
objId.elements[i].checked = false
}
else if (objId.elements[i].type == "select-one") {
objId.elements[i].options[0].selected = true
}
else if (objId.elements[i].type == "select-multiple") {
for (var j = 0j <objId.elements[i].options.lengthj++) {
objId.elements[i].options[j].selected = false
}
}
else if (objId.elements[i].type == "textarea") {
objId.elements[i].value = ""
}
//else if (objId.elements[i].type == "file") {
// //objId.elements[i].select()
// //document.selection.clear()
// // for IE, Opera, Safari, Chrome
// var file = objId.elements[i]
// if (file.outerHTML) {
// file.outerHTML = file.outerHTML
// } else {
// file.value = ""// FF(包括3.5)
// }
//}
}
}
方法2:使用 reset 按钮
页面中增加:
<!--用来清空表单数据-->
<input type="reset" name="reset" style="display: none" />
触发 reset 事件:
$("input[type=reset]").trigger("click")