form2里有两submit按钮,如何验证在onsubmit时,是Add 或者Del按钮触发的操作??? Add时需要检测两项内容,del时需要检测一项 ,因此需要区别出谁触发的条件。
也就是在function validdate()里检验,这样如果有数据错误的话 就不会直接提交。 如果直接用onclick=“” 的话,能提示alert错误,但是同时也就在有错误的时刻提交了。谢谢!!
代码如下:<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="./style.css" rel="stylesheet" type="text/css">
<title>Account</title><script type="text/javascript">function validdate()
{
if(document.getElementById("aaaaa").value == "Add") 执行add时,需要检测两项内容 {
if(document.form2.ACN_UserName.value.length == 0)
{
alert("The name is empty !");
return false;
}
if((document.getElementById("acn_passwd").value.length == 0))
{
alert("You password is empty!");
return false;
}
return true;
}
if(document.form2.defaultbotton.value == 'Del') 执行del是仅检测一项
{
if(document.form2.ACN_UserName.value.length == 0)
{
alert("The name is empty !");
return false;
}
return true;
}
}
</script>
</head>
<body>
<form name="form2" method="post" action" onsubmit="return validdate()">
<div id="label"><font class="font2">Add User</font></div><div id="OptionDiv">
<table cellpadding="1" cellspacing="1" class="option" width="100%">
<tr>
<td class="option_td" width="20%"> User Level</td>
<td class="option_td" width="30%"><select name="ACN_UserLevel" class="Select">
<option value="0">General</option>
<option value="1">Root</option>
</select></td>
<td class="option_td" width="20%"> Password</td>
<td class="option_td" width="30%"><input type="password" name="ACN_UserPasswd" maxlength="15" size="16" class="textinput" id="acn_passwd"></td>
</tr> <tr>
<td class="option_td" width="20%"> User Name</td>
<td class="option_td" width="30%"><input type="text" name="ACN_UserName" maxlength="15" size="16" class="textinput"></td>
<td class="option_td" width="20%"> Confirm Password</td>
<td class="option_td" width="30%"><input type="password" name="ACN_UserPasswdConfirm" maxlength="15" size="16" class="textinput" id="confirm_passwd"></td>
</tr>
</table>
</div>
<div id="OptionDiv" align="center">
<table class="option" cellpadding="1" cellspacing="1">
<tbody>
<tr>
<td class="Tbl1_td" style="text-align: center;">
<input type="submit" name="defaultbotton" value="Add" class="buttoninput" id ="aaaaa">
<input type="submit" name="defaultbotton" value="Del" class="buttoninput" id =="bbbbb">
</td>
</tr>
</tbody></table>
</div>
</form>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="./style.css" rel="stylesheet" type="text/css">
<title>Account </title> <script type="text/javascript"> function validdate()
{
if(window.temp == "Add")
{ alert("add")
if(document.form2.ACN_UserName.value.length == 0)
{
alert("The name is empty !");
return false;
}
if((document.getElementById("acn_passwd").value.length == 0))
{
alert("You password is empty!");
return false;
}
return true;
}
if(window.temp == 'Del')
{ alert("del")
if(document.form2.ACN_UserName.value.length == 0)
{
alert("The name is empty !");
return false;
}
return true;
}
}
</script>
</head>
<body>
<form name="form2" method="post" action" onsubmit="return validdate()">
<div id="label"> <font class="font2">Add User </font> </div> <div id="OptionDiv">
<table cellpadding="1" cellspacing="1" class="option" width="100%">
<tr>
<td class="option_td" width="20%"> User Level </td>
<td class="option_td" width="30%"> <select name="ACN_UserLevel" class="Select">
<option value="0">General </option>
<option value="1">Root </option>
</select> </td>
<td class="option_td" width="20%"> Password </td>
<td class="option_td" width="30%"> <input type="password" name="ACN_UserPasswd" maxlength="15" size="16" class="textinput" id="acn_passwd"> </td>
</tr> <tr>
<td class="option_td" width="20%"> User Name </td>
<td class="option_td" width="30%"> <input type="text" name="ACN_UserName" maxlength="15" size="16" class="textinput"> </td>
<td class="option_td" width="20%"> Confirm Password </td>
<td class="option_td" width="30%"> <input type="password" name="ACN_UserPasswdConfirm" maxlength="15" size="16" class="textinput" id="confirm_passwd"> </td>
</tr>
</table>
</div>
<div id="OptionDiv" align="center">
<table class="option" cellpadding="1" cellspacing="1">
<tbody>
<tr>
<td class="Tbl1_td" style="text-align: center;">
<input type="submit" name="defaultbotton" value="Add" onclick="window.temp=this.value" class="buttoninput" id ="aaaaa">
<input type="submit" name="defaultbotton" value="Del" onclick="window.temp=this.value" class="buttoninput" id =="bbbbb">
</td>
</tr>
</tbody> </table>
</div>
</form>
</body>
</html>
<head>
<title></title>
<script type="text/javascript"> function submitHandler(oEvent)
{
var sourceElem = oEvent.target || oEvent.srcElement;
if (sourceElem.id == "form1")
{
if (document.form1.txtName.value.length == 0)
{
window.alert("form1 txtName 未填写");
return false;
}
return true;
}
else
{
if (document.form2.txtCustomer.value.length == 0)
{
window.alert("form2 txtCustomer 未填写");
return false;
}
return true;
}
}
</script>
</head>
<body><form onsubmit="return submitHandler(event)" action="javascript:alert('提交form1');" id="form1" name="form1">
<input type="text" id="txtName" /><input type="submit" value="form1" />
</form><form onsubmit="return submitHandler(event)" action="javascript:alert('提交form2');" id="form2" name="form2">
<input type="text" id="txtCustomer" /><input type="submit" value="form2" />
</form></body>
</html>