设计一个登录窗口页输入账号密码点击登录,然后控制器接受请求页传送过来的参数并跳转到登录成功页,并显示账号和密码
时间: 2023-05-24 17:00:54 浏览: 49
在登录窗口页面,可以设置两个表单输入框,一个是账号,一个是密码。并且在表单下面设置一个“登录”按钮。
在后端控制器中,接受从登录窗口页面传来的账号和密码参数,并进行验证。如果验证通过,则跳转到登录成功页面。
在登录成功页面,可以显示账号和密码。展示账号和密码的方法有很多种,比如可以直接在页面中显示,也可以在页面中调用后端接口获取账号和密码信息,再进行展示。
相关问题
建立一个登录页面,有页面有账号、密码、登录按钮,输入正确的账号密码跳转到另一个页面
好的,以下是一个简单的登录页面示例,使用HTML和JavaScript实现:
```
<!DOCTYPE html>
<html>
<head>
<title>登录页面</title>
</head>
<body>
<h1>登录页面</h1>
<form>
<label for="username">用户名:</label>
<input type="text" id="username" name="username"><br><br>
<label for="password">密码:</label>
<input type="password" id="password" name="password"><br><br>
<button type="button" onclick="login()">登录</button>
</form>
<script>
function login() {
// 获取输入的用户名和密码
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
// 检查输入是否正确
if (username === "admin" && password === "123456") {
// 跳转到另一个页面
window.location.href = "welcome.html";
} else {
alert("用户名或密码错误,请重新输入。");
}
}
</script>
</body>
</html>
```
在这个示例中,我们创建了一个表单,包含了一个用户名输入框、一个密码输入框和一个登录按钮。当用户点击登录按钮时,JavaScript代码会获取输入框中的值,并检查是否与预设的用户名和密码匹配。如果匹配成功,就会跳转到另一个页面(在这里是welcome.html)。如果匹配失败,就会弹出一个提示框,提醒用户重新输入。
jsp点击一个按钮,点击以后弹出登录页面,输入账号密码,执行登录程序
在jsp页面中添加一个按钮,并绑定一个点击事件,点击事件触发后,调用JavaScript函数弹出登录页面:
<button onclick="showLogin()">登录</button>
<script>
function showLogin() {
window.open("login.jsp","_blank","width=400,height=300");
}
</script>
在login.jsp中,添加一个表单用于输入账号密码,并绑定一个提交事件,提交事件触发后,调用Servlet程序进行登录验证:
<form action="LoginServlet" method="post">
<label for="username">用户名:</label>
<input type="text" id="username" name="username"><br>
<label for="password">密码:</label>
<input type="password" id="password" name="password"><br>
<input type="submit" value="登录">
</form>
在LoginServlet中,获取表单提交的账号密码,进行验证,如果验证通过,跳转到主页面;否则,返回登录页面并提示错误信息:
public class LoginServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String username = request.getParameter("username");
String password = request.getParameter("password");
if (username.equals("admin") && password.equals("123456")) {
// 验证通过,跳转到主页面
response.sendRedirect("index.jsp");
} else {
// 验证失败,返回登录页面并提示错误信息
response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();
out.println("<script>alert('用户名或密码错误!');</script>");
out.println("<script>window.location.href='login.jsp';</script>");
}
}
}
相关推荐
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)