程序员一代码搬运工
【Java学习心得和Java学习技术个人总结】

表格提交前的验证(转)

就在在表单提交以前验正了表单里的内容

两个文本内容,一个用户一个密码

一个提交

在提交时检测表单里的内容,如果符合就转向另一个网页

 

 

正确用户名字yq1012

正确用户密码   yq1012

 

 

login.html代码

<html>
<head>
<title>登陆</title>
</head>
<script language="javascript">
function check()
{
 if (document.form1.username.value=="")
 {
  document.getElementById("usernameTip").innerHTML="<font color=red>请输入用户名</font>";
  document.form1.username.focus();
  return false;
 }
 else
  document.getElementById("usernameTip").innerHTML="";
 if (document.form1.userpwd.value=="")
 {
  document.getElementById("userpwdTip").innerHTML="<font color=red>请输入密码</font>";
  document.form1.userpwd.focus();
  return false;
 }
 else
  document.getElementById("userpwdTip").innerHTML="";
 if (document.form1.username.value!="yq1012")//============用户名:admin =========
 {
  document.getElementById("ischeckTip").innerHTML="<font color=red>用户名不存在</font>";
  document.form1.username.focus();
     return false;
 }
 if (document.form1.userpwd.value!="yq1012")//=======密码:123 =====
 {
  document.getElementById("ischeckTip").innerHTML="<font color=red>密码错误</font>";
  document.form1.userpwd.focus();
     return false;
 }
   return true;
     
}</script>
<body>
<form name="form1"  method="post" action="index.html">
  <table width="348" align="center" cellpadding="1" cellspacing="1" bgcolor="#99CCFF">
    <tr>
      <td width="59" bgcolor="#FFFFFF">用户名:</td>
      <td width="105" bgcolor="#FFFFFF"><input name="username" type="text" size="15" bgcolor="#FFFFFF"></td>
      <td width="174" id="usernameTip" bgcolor="#FFFFFF"> </td>
    </tr>
    <tr>
      <td bgcolor="#FFFFFF">密  码:</td>
      <td bgcolor="#FFFFFF"><input name="userpwd" type="password" size="15" bgcolor="#FFFFFF"></td>
      <td id="userpwdTip" bgcolor="#FFFFFF"> </td>
    </tr>
    <tr>
      <td bgcolor="#FFFFFF"> </td>
      <td bgcolor="#FFFFFF"><input type="submit" name="Submit1" value="提交" onClick="return check()">
      <input type="reset" name="Submit2" value="重置"></td>
      <td id="ischeckTip" bgcolor="#FFFFFF"> </td>
    </tr>
  </table>
</form>
</body>
</html>

 

 

index.html代码

<html>
<head>
<title>欢迎</title>
</head>
<body>
登陆成功
</body>
</html>

 

赞(0)
未经允许不得转载:程序员一代码搬运工 » 表格提交前的验证(转)
分享到: 更多 (0)