实验要求:
将实验2中的系统用户登录和注册页面改为JSP页面,并部署自己的Web应用于Tomcat服务器中
具体要求:
完成登录JSP页面设计和注册页面设计
在登录页面表单中使用request对象获取用户信息,建立新的JSP页面完成登录验证(用户名和密码自己指定即可)。
验证结果显示(如登录成功/用户名密码错误,可以使用JavaScript,也可以使用新的JSP页面)。
在注册页面表单中使用request对象获取用户注册信息(注册项目由自己指定),在新的JSP页面显示用户注册信息,并提示注册成功。
代码
登录页面index.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | < meta charset = "utf-8" >< meta http-equiv = "X-UA-Compatible" content = "IE=edge" >< meta name = "viewport" content = "width=device-width, initial-scale=1" >< title >jsp作业</ title >< link href = "css/bootstrap.min.css" rel = "external nofollow" >< nav class = "navbar navbar-default" >< div class = "container-fluid" > < div class = "navbar-header" > < a class = "navbar-brand" href = "./" rel = "external nofollow" >jsp作业</ a > </ div > < div class = "collapse navbar-collapse" id = "bs-example-navbar-collapse-1" > < ul class = "nav navbar-nav navbar-right" > < li >< a href = "login.jsp" rel = "external nofollow" >登录</ a ></ li > </ ul > </ div > </ div > </ nav >< div class = "container" > < div class = "jumbotron" > < h1 >Hello, world!</ h1 > < p >这是一个jsp作业</ p > </ div > </ div > |
登录页面login.jsp
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 | < meta charset = "utf-8" >< meta http-equiv = "X-UA-Compatible" content = "IE=edge" >< meta name = "viewport" content = "width=device-width, initial-scale=1" >< title >登录</ title >< link href = "css/bootstrap.min.css" rel = "external nofollow" >< nav class = "navbar navbar-default" >< div class = "container-fluid" > < div class = "navbar-header" > < a class = "navbar-brand" href = "./" rel = "external nofollow" >jsp作业</ a > </ div > < div class = "collapse navbar-collapse" id = "bs-example-navbar-collapse-1" > < ul class = "nav navbar-nav navbar-right" > < li >< a href = "login.jsp" rel = "external nofollow" >登录</ a ></ li > </ ul > </ div > </ div > </ nav >< div class = "container" > < div class = "row" > < div class = "col-md-4" > </ div > < div class = "col-md-4" > < form class = "form-signin" method = "post" action = "login-check.jsp" > < h2 class = "form-signin-heading" >登录到jsp作业</ h2 > < label for = "" >用户名</ label > < input type = "text" name = "username" id = "username" class = "form-control" placeholder = "请输入用户名" required = "" autofocus = "" >< br >< label for = "" >密码</ label > < input type = "password" name = "password" id = "password" class = "form-control" placeholder = "请输入密码" required = "" >< div class = "checkbox" > < label > < input type = "checkbox" value = "remember-me" checked = "" > 记住密码 </ label > </ div > < button type = "submit" class = "btn btn-primary" id = "btn-login" >登录</ button > < a href = "reg.jsp" rel = "external nofollow" class = "btn btn-default" >注册</ a > </ form > </ div > < div class = "col-md-4" > </ div > </ div > </ div > < p >登录结果页面login-check.jsp</ p > < div class = "jb51code" > < pre class = "brush:xhtml;" > < meta charset = "utf-8" >< meta http-equiv = "X-UA-Compatible" content = "IE=edge" >< meta name = "viewport" content = "width=device-width, initial-scale=1" >< title >登录</ title >< link href = "css/bootstrap.min.css" rel = "external nofollow" >< nav class = "navbar navbar-default" >< div class = "container-fluid" > < div class = "navbar-header" > < a class = "navbar-brand" href = "./" rel = "external nofollow" >jsp作业</ a > </ div > < div class = "collapse navbar-collapse" id = "bs-example-navbar-collapse-1" > < ul class = "nav navbar-nav navbar-right" > < li >< a href = "login.jsp" rel = "external nofollow" >登录</ a ></ li > </ ul > </ div > </ div > </ nav >< div class = "container" > < div class = "row" > < div class = "col-md-4" > </ div > < div class = "col-md-4" > < form class = "form-signin" method = "post" action = "login-check.jsp" > < h2 class = "form-signin-heading" >登录到jsp作业</ h2 > < label for = "" >用户名</ label > < input type = "text" name = "username" id = "username" class = "form-control" placeholder = "请输入用户名" required = "" autofocus = "" >< br >< label for = "" >密码</ label > < input type = "password" name = "password" id = "password" class = "form-control" placeholder = "请输入密码" required = "" >< div class = "checkbox" > < label > < input type = "checkbox" value = "remember-me" checked = "" > 记住密码 </ label > </ div > < button type = "submit" class = "btn btn-primary" id = "btn-login" >登录</ button > < a href = "reg.jsp" rel = "external nofollow" class = "btn btn-default" >注册</ a > </ form > </ div > < div class = "col-md-4" > </ div > </ div > </ div > < p >注册页面reg.jsp</ p > < div class = "jb51code" > < pre class = "brush:xhtml;" > < meta charset = "utf-8" >< meta http-equiv = "X-UA-Compatible" content = "IE=edge" >< meta name = "viewport" content = "width=device-width, initial-scale=1" >< title >注册</ title >< link href = "css/bootstrap.min.css" rel = "external nofollow" >< nav class = "navbar navbar-default" >< div class = "container-fluid" > < div class = "navbar-header" > < a class = "navbar-brand" href = "./" rel = "external nofollow" >jsp作业</ a > </ div > < div class = "collapse navbar-collapse" id = "bs-example-navbar-collapse-1" > < ul class = "nav navbar-nav navbar-right" > < li >< a href = "login.jsp" rel = "external nofollow" >登录</ a ></ li > </ ul > </ div > </ div > </ nav >< div class = "container" > < div class = "row" > < div class = "col-md-4" > </ div > < div class = "col-md-4" > < form class = "form-signin" action = "reg-submit.jsp" method = "post" > < h2 class = "form-signin-heading" >注册到jsp作业</ h2 > < div id = "info" > </ div > < label for = "" >用户名</ label > < input type = "text" name = "username" id = "username" class = "form-control" placeholder = "请输入用户名" required = "" autofocus = "" >< br >< label for = "" >密码</ label > < input type = "password" name = "password" id = "password" class = "form-control" placeholder = "请输入密码" required = "" >< br >< label for = "" >重复密码</ label > < input type = "password" name = "password2" id = "password2" class = "form-control" placeholder = "请再次输入密码" required = "" maxlength = "16" >< br >< button type = "submit" class = "btn btn-primary" id = "btn-reg" >注册</ button > < a href = "login.jsp" rel = "external nofollow" class = "btn btn-default" id = "btn-reg" >返回登录</ a > </ form > </ div > < div class = "col-md-4" > </ div > </ div > </ div > < p >注册结果页面reg-submit.jsp</ p > < div class = "jb51code" > < pre class = "brush:xhtml;" > < meta charset = "utf-8" >< meta http-equiv = "X-UA-Compatible" content = "IE=edge" >< meta name = "viewport" content = "width=device-width, initial-scale=1" >< title >结果</ title >< link href = "css/bootstrap.min.css" rel = "external nofollow" >< nav class = "navbar navbar-default" >< div class = "container-fluid" > < div class = "navbar-header" > < a class = "navbar-brand" href = "./" rel = "external nofollow" >jsp作业</ a > </ div > < div class = "collapse navbar-collapse" id = "bs-example-navbar-collapse-1" > < ul class = "nav navbar-nav navbar-right" > < li >< a href = "login.jsp" rel = "external nofollow" >登录</ a ></ li > </ ul > </ div > </ div > </ nav >< div class = "container" > 注册成功</ div >"); out.println("</ pre > < ul class = "list-group" >");< br > out.println("< p ></ p > < li class = "list-group-item" >用户名:" + username + "</ li > < p >");< br > out.println("</ p > < li class = "list-group-item" >密码:" + password + "</ li > < p >");< br > out.println("</ p ></ ul > < p >");< br > }< br > else{< br > out.println("</ p > < div class = "alert alert-danger" role = "alert" >两次密码输入不一致,请重新输入</ div > < p >");< br > }< br > %></ p > </ div > </ pre ></ div > < p >< span style = "color: #ff0000" >< strong >效果 </ strong ></ span ></ p > < p style = "text-align: center" >< img decoding = "async" src = "https://www.2it.club/wp-content/uploads/2023/02/frc-1413bc1229321e19689e4f65d379aecc.png" ></ p > < p style = "text-align: center" >< img decoding = "async" src = "https://www.2it.club/wp-content/uploads/2023/02/frc-e33f3cac2c3968d6c0ca90574055b699.png" ></ p > < p style = "text-align: center" >< img decoding = "async" src = "https://www.2it.club/wp-content/uploads/2023/02/frc-3e5eafef7bbb88ee53197ef02ac5b58f.png" ></ p > < p style = "text-align: center" >< img decoding = "async" src = "https://www.2it.club/wp-content/uploads/2023/02/frc-7567886975110c952f1120e658f4465e.png" ></ p > < p style = "text-align: center" >< img decoding = "async" src = "https://www.2it.club/wp-content/uploads/2023/02/frc-afe6f69ccee9f9eec2cd61548986720f.png" ></ p > < p style = "text-align: left" >到此这篇关于使用JSP实现简单的用户登录注册页面示例代码解析的文章就介绍到这了,更多相关JSP实现简单的用户登录注册页面内容请搜索IT俱乐部以前的文章或继续浏览下面的相关文章希望大家以后多多支持IT俱乐部!</ p > </ pre ></ div > < div class = "lbd_bot clearfix" > < span id = "art_bot" class = "jbTestPos" ></ span > </ div > < div class = "tags clearfix" > < i class = "icon-tag" ></ i >< p ></ p > < ul class = "meta-tags" > < li class = "tag item" >< a href = "http://common.jb51.net/tag/JSP/1.htm" target = "_blank" title = "搜索关于JSP的文章" rel = "nofollow noopener" >JSP</ a ></ li > < li class = "tag item" >< a href = "http://common.jb51.net/tag/%E7%99%BB%E5%BD%95/1.htm" target = "_blank" title = "搜索关于登录的文章" rel = "nofollow noopener" >登录</ a ></ li > < li class = "tag item" >< a href = "http://common.jb51.net/tag/%E6%B3%A8%E5%86%8C/1.htm" target = "_blank" title = "搜索关于注册的文章" rel = "nofollow noopener" >注册</ a ></ li > </ ul > </ div > < div class = "lbd clearfix" > < span id = "art_down" class = "jbTestPos" ></ span > </ div > < div id = "shoucang" ></ div > < div class = "xgcomm clearfix" > < h2 >相关文章</ h2 > < ul > < li class = "lbd clearfix" >< span id = "art_xg" class = "jbTestPos" ></ span ></ li > < li > < div class = "item-inner" > < a href = "https://www.2it.club/article/129598.htm" title = "JSP页面跳转方法大全" class = "img-wrap" target = "_blank" rel = "noopener" > < img decoding = "async" src = "https://www.2it.club/wp-content/uploads/2023/02/frc-1a1b05c64693fbf380aa1344a7812747.png" ></ a >< p ></ p > < div class = "rbox" > < div class = "rbox-inner" > < p >< a class = "link title" target = "_blank" href = "https://www.2it.club/article/129598.htm" title = "JSP页面跳转方法大全" rel = "noopener" >JSP页面跳转方法大全</ a ></ p > < div class = "item-info" > < div class = "js" >这篇文章主要介绍了JSP页面跳转的多种方法,包换在JSP脚本中直接跳转,利用前端HTML,JS实现跳转</ div > < p >< span class = "lbtn" style = "float:right" > 2017-12-12 </ span > </ p ></ div > </ div > </ div > </ div > </ li > < li > < div class = "item-inner" > < a href = "https://www.2it.club/article/45826.htm" title = "servlet实现文件下载的实用类分享" class = "img-wrap" target = "_blank" rel = "noopener" > < img decoding = "async" src = "https://www.2it.club/wp-content/uploads/2023/02/frc-4f55910a645b073bc4fc65dc10dc14bd.png" ></ a >< p ></ p > < div class = "rbox" > < div class = "rbox-inner" > < p >< a class = "link title" target = "_blank" href = "https://www.2it.club/article/45826.htm" title = "servlet实现文件下载的实用类分享" rel = "noopener" >servlet实现文件下载的实用类分享</ a ></ p > < div class = "item-info" > < div class = "js" >servlet文件下载类,为了防止客户端浏览器直接打开目标文件,在响应头里加入强制下载的MIME类型,大家参考使用吧</ div > < p >< span class = "lbtn" style = "float:right" > 2014-01-01 </ span > </ p ></ div > </ div > </ div > </ div > </ li > < li > < div class = "item-inner" > < a href = "https://www.2it.club/article/186540.htm" title = "JSP登录中Session的用法实例详解" class = "img-wrap" target = "_blank" rel = "noopener" > < img decoding = "async" src = "https://www.2it.club/wp-content/uploads/2023/02/frc-0ea3c7666119d5615e582f823fb3fad6.png" ></ a >< p ></ p > < div class = "rbox" > < div class = "rbox-inner" > < p >< a class = "link title" target = "_blank" href = "https://www.2it.club/article/186540.htm" title = "JSP登录中Session的用法实例详解" rel = "noopener" >JSP登录中Session的用法实例详解</ a ></ p > < div class = "item-info" > < div class = "js" >这篇文章主要介绍了JSP登录中Session的用法,结合实例形式详细分析了JSP登录中使用Session的具体操作技巧与注意事项,需要的朋友可以参考下</ div > < p >< span class = "lbtn" style = "float:right" > 2020-05-05 </ span > </ p ></ div > </ div > </ div > </ div > </ li > < li > < div class = "item-inner" > < a href = "https://www.2it.club/article/18918.htm" title = "jsp 重复提交问题" class = "img-wrap" target = "_blank" rel = "noopener" > < img decoding = "async" src = "https://www.2it.club/wp-content/uploads/2023/02/frc-4f96a78db829b1556ff16de21e013c7a.png" ></ a >< p ></ p > < div class = "rbox" > < div class = "rbox-inner" > < p >< a class = "link title" target = "_blank" href = "https://www.2it.club/article/18918.htm" title = "jsp 重复提交问题" rel = "noopener" >jsp 重复提交问题</ a ></ p > < div class = "item-info" > < div class = "js" ></ div > < p >< span class = "lbtn" style = "float:right" > 2009-07-07 </ span > </ p ></ div > </ div > </ div > </ div > </ li > < li > < div class = "item-inner" > < a href = "https://www.2it.club/article/46956.htm" title = "在jsp页面如何获得url参数" class = "img-wrap" target = "_blank" rel = "noopener" > < img decoding = "async" src = "https://www.2it.club/wp-content/uploads/2023/02/frc-8cc1031babc6aff2319f1c6af8544aa0.png" ></ a >< p ></ p > < div class = "rbox" > < div class = "rbox-inner" > < p >< a class = "link title" target = "_blank" href = "https://www.2it.club/article/46956.htm" title = "在jsp页面如何获得url参数" rel = "noopener" >在jsp页面如何获得url参数</ a ></ p > < div class = "item-info" > < div class = "js" >这篇文章主要介绍了在jsp页面获得url参数的方法,需要的朋友可以参考下</ div > < p >< span class = "lbtn" style = "float:right" > 2014-02-02 </ span > </ p ></ div > </ div > </ div > </ div > </ li > < li > < div class = "item-inner" > < a href = "https://www.2it.club/article/82422.htm" title = "详解JSP中的语句对象Statement操作MySQL的使用实例" class = "img-wrap" target = "_blank" rel = "noopener" > < img decoding = "async" src = "https://www.2it.club/wp-content/uploads/2023/02/frc-0c932a99bb7b6f23c937db507070cc7b.png" ></ a >< p ></ p > < div class = "rbox" > < div class = "rbox-inner" > < p >< a class = "link title" target = "_blank" href = "https://www.2it.club/article/82422.htm" title = "详解JSP中的语句对象Statement操作MySQL的使用实例" rel = "noopener" >详解JSP中的语句对象Statement操作MySQL的使用实例</ a ></ p > < div class = "item-info" > < div class = "js" >这篇文章主要介绍了JSP中的语句对象Statement操作MySQL的使用实例,讲解了添加记录、更新记录、删除记录三种操作,说明都在代码注释中简单明了,需要的朋友可以参考下</ div > < p >< span class = "lbtn" style = "float:right" > 2016-04-04 </ span > </ p ></ div > </ div > </ div > </ div > </ li > < li > < div class = "item-inner" > < a href = "https://www.2it.club/article/73909.htm" title = "JSP页面中超链接传递中文参数出现乱码问题解决方法" class = "img-wrap" target = "_blank" rel = "noopener" > < img decoding = "async" src = "https://www.2it.club/wp-content/uploads/2023/02/frc-cca732bf65a93ed2ec0ac80c638460fe.png" ></ a >< p ></ p > < div class = "rbox" > < div class = "rbox-inner" > < p >< a class = "link title" target = "_blank" href = "https://www.2it.club/article/73909.htm" title = "JSP页面中超链接传递中文参数出现乱码问题解决方法" rel = "noopener" >JSP页面中超链接传递中文参数出现乱码问题解决方法</ a ></ p > < div class = "item-info" > < div class = "js" >这篇文章主要介绍了JSP页面中超链接传递中文参数出现乱码问题解决方法,涉及jsp页面参数传递与字符串处理技巧,具有一定参考借鉴价值,需要的朋友可以参考下</ div > < p >< span class = "lbtn" style = "float:right" > 2015-10-10 </ span > </ p ></ div > </ div > </ div > </ div > </ li > < li > < div class = "item-inner" > < a href = "https://www.2it.club/article/105314.htm" title = "JSP中EL表达式的用法详解(必看篇)" class = "img-wrap" target = "_blank" rel = "noopener" > < img decoding = "async" src = "https://www.2it.club/wp-content/uploads/2023/02/frc-2d9f31f2af7b675a3d153d2b7f1035a7.png" ></ a >< p ></ p > < div class = "rbox" > < div class = "rbox-inner" > < p >< a class = "link title" target = "_blank" href = "https://www.2it.club/article/105314.htm" title = "JSP中EL表达式的用法详解(必看篇)" rel = "noopener" >JSP中EL表达式的用法详解(必看篇)</ a ></ p > < div class = "item-info" > < div class = "js" >下面小编就为大家带来一篇JSP中EL表达式的用法详解(必看篇)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧</ div > < p >< span class = "lbtn" style = "float:right" > 2017-02-02 </ span > </ p ></ div > </ div > </ div > </ div > </ li > < li > < div class = "item-inner" > < a href = "https://www.2it.club/article/239347.htm" title = "解决request.getParameter取值后的if判断为NULL的问题" class = "img-wrap" target = "_blank" rel = "noopener" > < img decoding = "async" src = "https://www.2it.club/wp-content/uploads/2023/02/frc-b452cee8ec5cd9e58ab98eba17281e59.png" ></ a >< p ></ p > < div class = "rbox" > < div class = "rbox-inner" > < p >< a class = "link title" target = "_blank" href = "https://www.2it.club/article/239347.htm" title = "解决request.getParameter取值后的if判断为NULL的问题" rel = "noopener" >解决request.getParameter取值后的if判断为NULL的问题</ a ></ p > < div class = "item-info" > < div class = "js" >这篇文章主要介绍了解决request.getParameter取值后的if判断为NULL的问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教</ div > < p >< span class = "lbtn" style = "float:right" > 2022-03-03 </ span > </ p ></ div > </ div > </ div > </ div > </ li > < li > < div class = "item-inner" > < a href = "https://www.2it.club/article/16480.htm" title = "hibernate更新数据方法小结" class = "img-wrap" target = "_blank" rel = "noopener" > < img decoding = "async" src = "https://www.2it.club/wp-content/uploads/2023/02/frc-f4838ec7e2d4da28e0b57d4e852dadd4.png" ></ a >< p ></ p > < div class = "rbox" > < div class = "rbox-inner" > < p >< a class = "link title" target = "_blank" href = "https://www.2it.club/article/16480.htm" title = "hibernate更新数据方法小结" rel = "noopener" >hibernate更新数据方法小结</ a ></ p > < div class = "item-info" > < div class = "js" >session.update不能直接用,因为他是以ID为主键,必须查询出ID才能进行更新。。。< p ></ p > </ div > < p >< span class = "lbtn" style = "float:right" > 2008-11-11 </ span > </ p ></ div > </ div > </ div > </ div > </ li > </ ul > </ div > < div class = "lbd clearfix mt5" > < span id = "art_down2" class = "jbTestPos" ></ span > </ div > < p > < a href = "" ></ a ></ p > < div id = "comments" > < h2 >最新评论</ h2 > < div class = "pd5" > < div id = "SOHUCS" sid = "art_192647" ></ div > < p ></ p ></ div > < p ></ p ></ div > |