submit提交和button提交的區別
submit的提交:
1.一般submit提交之後就不再響應其他事件。
2.函數 onsubmit()可以用於驗證表單提交,驗證失敗不能提交
下面是例子
<!DOCTYPE html>
<html>
<head>
<title>login.html</title>
<script type="text/javascript">
function testSubmit() {
if (document.getElementById("login").value == "") {
alert("用戶名不能爲空");
return false;
}else
{
document.getElementById("f1").action="/ajaxtest2/ajax/welcome.html";
return true;
}
}
</script>
</head>
<body>
<form name="f1" id="f1" action="" method="post" onsubmit="return testSubmit()">
<table>
<tr>
<td>Login:</td>
<td><input type="text" name="login" id="login">
</td>
</tr>
<tr>
<td>Password:</td>
<td><input type="password" name="password" id="password">
</td>
</tr>
<tr>
<td colspan="2" align="center"><input type="submit">
</td>
</tr>
</table>
</form>
</body>
</html>
下面是button按鈕的用法
<!DOCTYPE html>
<html>
<head>
<title>login.html</title>
<script type="text/javascript">
function testSubmit() {
if (document.getElementById("login2").value == "") {
alert("用戶名不能爲空");
document.getElementById("login2").focus();
return false;
}else
{
document.getElementById("f2").action="/ajaxtest2/ajax/welcome.html";
return true;
}
}
</script>
</head>
<body>
<form name="f2" id="f2" action="" method="post">
<table>
<tr>
<td>Login:</td>
<td><input type="text" name="login2" id="login2">
</td>
</tr>
<tr>
<td>Password:</td>
<td><input type="password" name="password2" id="password2">
</td>
</tr>
<tr>
<td colspan="2" align="center"><input type="button" onclick="testSubmit()" value="提交">
</td>
</tr>
</table>
</form>
</body>
</html>