个人简历管理系统（3）- 登陆与注册界面
2024-05-10 04:01:59
个人简历管理系统- 登陆与注册界面
- HTML + CSS + JAvascript
- login.jsp
- register.jsp
- link.html
- web.xml
- 备注
HTML + CSS + JAvascript
推荐几个学习网站
菜鸟教程
w3school 在线教程前端采用Bootstrap框架 具体请查看菜鸟教程Bootstrap4
注意离线演示的时候，可以效果不好，把Bootstrap4的源代码下载到本地，并修改网页的链接。
文件结构
login.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head><%@include file="link.html" %><script type="text/javascript" defer="defer" >function mycheck(){if(isNull(form1.user.value)){alert("请输入账号");return false;}if(isNull(form1.pwd.value)){alert("请输入密码");return false;}return true;}
function isNull(str){if ( str == "" ) return true;var regu = "^[ ]+$";var re = new RegExp(regu);return re.test(str);}
</script></head><c:if test="${not empty requestScope.message}"><script>alert("<c:out value="${requestScope.message}"></c:out>");</script>
</c:if><body><div class="jumbotron text-center" style="margin-bottom:0px;color: red;" ><h1>个人简历管理系统</h1>
</div><nav class="navbar navbar-expand-sm bg-dark navbar-dark"><a class="navbar-brand" href="#">导航</a><button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar"><span class="navbar-toggler-icon"></span></button><div class="collapse navbar-collapse" id="collapsibleNavbar"><ul class="navbar-nav"><li class="nav-item"><a class="nav-link" href="login.jsp">登陆</a></li><li class="nav-item"><a class="nav-link" href="register.jsp">注册</a></li></ul></div>
</nav><form id="form1" name="form1" method="post" action="login" onsubmit="return mycheck()"><table width="100%" border="0" cellpadding="0" cellspacing="0" ><tr><td height="27"> </td><td height="27" colspan="2" align="center"> </td><td> </td></tr> <tr><td width="30%" height="37"> </td><td width="5%">用户名：</td><td width="31%"><input type="text" name="user" id="user" value=""></td><td width="9%"> </td></tr><tr><td height="37"> </td><td>密码：</td><td><input type="password" name="pwd" id="pwd" value=""></td><td> </td></tr><tr><td height="37"> </td><td><input name="submit" type="submit" class="btn_grey" value="登陆"></td><td><input name="submit3" type="reset" class="btn_grey" value="重置"></td> <td> </td></tr></table> </form>
</body>
</html>register.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head><%@include file="link.html" %></head><script type="text/javascript" defer="defer" >function mycheck(){if(isNull(form1.user.value)){alert("请输入账号");return false;}if(isNull(form1.pwd1.value)){alert("请输入密码");return false;}if(isNull(form1.pwd2.value)){alert("请再一次输入密码");return false;}if(form1.pwd1.value!=form1.pwd2.value){alert("你两次的密码不相同，请重新输入");return false;}return true;}
function isNull(str){if ( str == "" ) return true;var regu = "^[ ]+$";var re = new RegExp(regu);return re.test(str);}
</script><c:if test="${not empty requestScope.message}"><script>alert("<c:out value="${requestScope.message}"></c:out>");</script>
</c:if><body><div class="jumbotron text-center" style="margin-bottom:0px;color: red;" ><h1>个人简历管理系统</h1>
</div><nav class="navbar navbar-expand-sm bg-dark navbar-dark"><a class="navbar-brand" href="#">导航</a><button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar"><span class="navbar-toggler-icon"></span></button><div class="collapse navbar-collapse" id="collapsibleNavbar"><ul class="navbar-nav"><li class="nav-item"><a class="nav-link" href="login.jsp">登陆</a></li><li class="nav-item"><a class="nav-link" href="register.jsp">注册</a></li></ul></div>
</nav><form id="form1" name="form1" method="post" action="register" onsubmit="return mycheck()"><table width="100%" border="0" cellpadding="0" cellspacing="0" ><tr><td height="27"> </td><td height="27" colspan="2" align="center"> </td><td> </td></tr> <tr><td width="30%" height="37"> </td><td width="5%">用户名：</td><td width="31%"><input type="text" name="user" id="user" value=""></td><td width="9%"> </td></tr><tr><td height="37"> </td><td>密码：</td><td><input type="password" name="pwd1" id="pwd1" value=""></td><td> </td></tr><tr><td height="37"> </td><td>重复密码：</td><td><input type="password" name="pwd2" id="pwd2" value=""></td><td> </td></tr><tr><td height="37"> </td><td><input name="submit" type="submit" class="btn_grey" value="注册"></td><td><input name="submit3" type="reset" class="btn_grey" value="重置"></td> <td> </td></tr></table> </form>
</body>
</html>link.html
<title>个人简历管理系统</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.1.0/css/bootstrap.min.css"><script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script><script src="https://cdn.bootcss.com/popper.js/1.12.5/umd/popper.min.js"></script><script src="https://cdn.bootcss.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
web.xml
修改网页访问的默认路径
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0"><display-name>resume</display-name><!-- 在web.xml中通过配置来告诉web应用，所有html文件输出时都采用UTF-8的编码 --><jsp-config>
<jsp-property-group>
<url-pattern>*.html</url-pattern>
<page-encoding>UTF-8</page-encoding>
</jsp-property-group>
</jsp-config><!-- 在web.xml中通过配置来告诉web应用，默认访问起始页 --><welcome-file-list><welcome-file>login.jsp</welcome-file></welcome-file-list>
</web-app>
备注
项目相关博客
个人简历管理系统（1）-数据库创建
个人简历管理系统（2）-数据库连接
参考博客
用eclipse创建一个javaweb项目
封装一个泛型类的JDBC工具类
个人简历管理系统（3）- 登陆与注册界面相关推荐
- 个人简历管理系统（6）-登陆与注册后端实现
个人简历管理系统-登陆与注册后端实现 文件结构 login.java register.java link.html header.html main.jsp 备注 文件结构 login.java p ...
- CSS中实现文字两端对齐的方法，登陆注册界面经常用到
在写登陆或注册界面时,经常会遇到文字两端对齐(word中有类似对齐方式)的问题,如下图: 用户名和密码并没有两端对齐,那么该怎样处理 其实只需要两行CSS代码就可以解决: 关键两行是:text-ali ...
- 个人简历管理系统-总结
个人简历管理系统-总结 项目下载地址 参考博客 项目下载地址 个人简历管理系统 参考博客 项目相关博客 个人简历管理系统(1)-数据库创建 个人简历管理系统(2)-数据库连接 个人简历管理系统(3)- ...
- 个人简历管理系统（11）- 查看简历具体信息
个人简历管理系统- 查看简历具体信息 文件结构 show.jsp 备注 文件结构 show.jsp <%@ page language="java" contentType= ...
- 个人简历管理系统（7）-控制层
个人简历管理系统- 控制层 文件结构 ResumeService.java 业务逻辑分析 源代码 备注 文件结构 ResumeService.java 业务逻辑分析 业务逻辑 D方法 添加简历 add ...
- 个人简历管理系统（9）- 添加简历
个人简历管理系统- 添加简历 文件结构 add.jsp 备注 文件结构 add.jsp <%@ page language="java" contentType=" ...
- 个人简历管理系统（10）- 查看所有简历列表
个人简历管理系统- 查看所有简历列表 文件结构 viewAll.jsp 备注 文件结构 viewAll.jsp <%@ page language="java" conten ...
- 个人简历管理系统（5）-Dao
个人简历管理系统-Dao UserDao 业务逻辑分析 源代码 测试截图 ResumeDao 业务逻辑分析 源代码 备注 UserDao 业务逻辑分析 业务逻辑 Dao层方法 用户登录 check 用 ...
- html+JavaScript登陆注册界面
最近刚刚学习了一些关于JavaScript的知识,便在之前学习的html前端的基础上 做了一些简单的修改,本身还存在着很多的缺陷,希望大家多多指正. githu下载地址:https://github. ...
最新文章
- pytorch cross_entropy
- python自动测试p-Python-selenium-自动化测试模型
- window 程序报错 自动重启_好程序员web前端教程之详解JavaScript严格模式
- 方案改进：直接通过User Control生成HTML
- 架构解读丨Volcano作业资源预留设计原理
- givens变换化上hessenborg矩阵为上三角矩阵
- [转]24个英文电子书免费下载网站
- ionic ion-refresher刷新完毕
- -atime、-ctime、mtime、-newer
- 关于VC++6.0显示“不能启动工具，操作成功完成”问题
- 拼多多是PHP还是java,应届程序员收到拼多多offer 表情瞬间爆发
- 荣耀手机和小米打出了真火，针锋相对比拼千元机
- 华为ensp防火墙web登陆配置
- 转载：嵌入式系统综述之二
- python 源码编译 without_vcmi(魔法门英雄无敌3 - 开源复刻版) 源码编译(示例代码)...
- java工具多,[转帖]一个 Java 工具到底有多大？
- 图像化界面开发之QT入门
- 淘宝社会工程学攻击手段
- web标准只包括html,HTML——01-前言WEB标准
- 中基鸿业家庭怎么理财