javaweb制作网页欢迎页面

判断用户名和密码是否为空如果其一为空则跳出错误提示，要求重新输入用户名密码。创建两个jsp文件，一个为登陆成功页面，一个为失败页面，文件名自拟。在上一步空值判断完毕后，判断用户名和密码是否为同学名字的全拼，如果是跳转到成功页面，否则跳转至失败页面(比如：失败页面可以使用include指令加入登陆的页面)登陆页面：<%@page contentType="text/html" pageEnco

冯小猿

2024人浏览 · 2022-05-12 11:19:20

冯小猿 · 2022-05-12 11:19:20 发布

判断用户名和密码是否为空如果其一为空则跳出错误提示，要求重新输入用户名密码。
创建两个jsp文件，一个为登陆成功页面，一个为失败页面，文件名自拟。在上一步空值判断完毕后，判断用户名和密码是否为同学名字的全拼，如果是跳转到成功页面，否则跳转至失败页面(比如：失败页面可以使用include指令加入登陆的页面)
登陆页面：

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>登陆页面</title>
        <style>
            #bg{
                width: 50%;
                height: 50%;
                top:50%;
                left:70%;
                position: fixed;
                background-size:60%;
}
        </style>
        <script type="text/javascript">
            function check(){
                var a=document.getElementById("用户名").value;
                var b=document.getElementById("密码").value;
                var c=document.getElementById("用户名").value;
                var d=document.getElementById("密码").value;
                if(a!=c)
                    alert("用户名错误!");
                else if(b!=d)
                    alert("密码错误!");
                else alert("欢迎进入绵羊村!")
            }
        </script>
    </head>
    <body>
    <div id="top"><span style="color:red">${errors}</span></div>
<form id="login" action="/servlet/LoginServlet" method="post">
    用户名:<input type="text" name="user" id="user" /><br>
    密&nbsp;&nbsp;&nbsp;码:<input type="password" name="pwd" id="pwd" /><br>
<!--    验证码(点击图片更换验证码):<br>-->
<!--    <input name="check" type="text" id="check" maxlength="4" class="check_input" /><br>-->
    <input type="submit" value="确定">
    <input type="reset" value="重置">
    </form>
    </body>
</html>

欢迎页面：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>登录界面</title>
		<style>
		    #bg{
			width:30%;
			height:25%;
			top:30%;
			left:60%;
			position:fixed;
			background-image:url('https://b-ssl.duitang.com/uploads/item/201406/28/20140628134651_sWicV.jpeg');
			background-size:60%;
		     }
		</style>
		<script type="text/javascript" >
		     function check() {
			 var a=document.getElementById('username').value;
			 var b=document.getElementById('password').value;
			 var c=document.getElementById('Username').value;
			 var d=document.getElementById('Password').value;
			 if(a!=c)
			      alert("error");
			 else if(b!=d)
			      alert("error");
			 else alert("Welcome!");
		     }
		</script>
	</head>
	<body>
	      <div id="bg">
		   <form>
		      <table width="100%">
			 <tr>
				<td style="text-align:right" height:"100px">
				<p>name:</p></td>
				<td><input type="text" id="username">
				<input type="hidden" id="Username" value="123456"></td>
			</tr>
			<tr>
				<td style="text-align:right">
				<p>password:</p></td>
				<td><input type="password" id="password">
				<input type="hidden" id="Password" value="123456"></td>
			</tr>
			<tr>
				 <td>&nbsp;</td>
				  <td><input type="button" value="loading" onclick='check()'></td>
			</tr>
			</table>
		    </form>
		</div>
	</body>
</html>