您的位置:首页 > Web前端 > JavaScript

javascript制作一个用户登录表单提交检验网页(第一天)

2015-10-31 15:09 821 查看
firstDay:利用javascript制作一个用户登录表单提交检验网页:

代码如下:

<span style="font-family:KaiTi_GB2312;font-size:14px;"><!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function check(){
var name = form1.username.value;
var password = form1.userpassword.value;
if(name==""||name==null){
alert("Please input your username!");
form1.username.focus();
return;
}
if(password != "123"){
alert("your password is wrong,please try again!");
return;
}
form1.submit();
}
</script>
</head>
<body>
<form action="" name ="form1" method="post">
<table width="320"  border="2" cellspacing="10" cellpadding="0"
bordercolor="#FFFFFF" bordercolordark="#FF0000" bordercolorlight="#00FF00">
<tr>
<td height="30" colspan="2"	bgcolor="#eeeeee" >* 用户登录</td>
</tr>
<tr height="34">
<td width="120" >用户名:</td>
<td width="200">
<input name="username" type="text" id="username">
</td>
</tr>
<tr>
<td width="120">密  码:</td>
<td width="200"><input name="userpassword" type="password" id="userpassword"	></td>
</tr>
<tr height="30" bgcolor="#eedddd">
<td width="100" ><input  width = "100" height="45" name="submit" type="button" value="登录" onClick="check()" ></td>
<td width="100" align="left"><input width = "160" height="45" name="reset" type="reset" value="重置"></td>
</tr>
</table>
</form>
</body>
</html>
</span>


运行结果:

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: