Java Web制作用户注册从安装到完成-简陋洛谷(这可能是全网最详细简单的教程)【此后无良辰】

Java Web制作用户注册从安装到完成-简陋洛谷(这可能是全网最详细简单的教程)

在这里插入图片描述
在这里插入图片描述

要求看看就好后有总结

1.下载安装Tomcat8,对其进行配置。启动Tomcat服务器,在浏览器输入 http://127.0.0.1:8080/,查看浏览器输出界面;
2. 定制配置:
(1)修改Tomcat的服务端口为88(默认安装为8080);
(2)修改HTTP GET方式的字符编码为UTF-8(默认为ISO-8859-1); 
3.编写一个用户注册模块,功能如下:
(1)设计用户注册表单页面register.jsp,包含:用户名(文本框)、密码(密码框)、性别(下拉框);
(2)设计用户注册数据保存页面doRegister.jsp,用以保存用户数据至user.txt文件。
user.txt中每行保存一个用户,格式为:“用户名,密码,性别”;
(3)如果user.txt已包含同名的用户,提示用户已存在;否则提示注册成功。
4.编写用户登录模块,功能如下:
(1)设计用户登录表单页面login.jsp,包含:用户名(文本框)、密码(密码框);
(2)设计登录验证文件doLogin.jsp,获取客户端提交的用户名、密码,然后从user.txt中验证是否存在该用户,登录密码是否正确;
(3)将登录验证结果反馈给用户。

在这里插入图片描述

总结一下

1.做一个网站 其中要用到网络服务器Tomcat(因为不要钱 )好用!
在这里插入图片描述

2.注册要验证重复信息
3.设计登陆页面,一共等于四个jsp文件

需要的知识和软件

  • 基本的前端知识,前端知识都不会就别提做网页了吧,推荐B大学
    在这里插入图片描述
    这是我自己推荐的,当然有点老了,新的可以看尚硅谷的(使用的是idea)
  • 文件输入输出,因为其他知识的冗杂,这点显得很简单,详情请见我的另一篇博客—JAVA学习
  • 服务器的安装知识,推荐一篇特别好的博客 安装Tomcat
  • 在idea部署服务器 链接 :2020idea部署Tomcat
    ---------------------------------------------------分界线-----------------------------------------------

正式开始

如果你真的把需要的知识学好了
把必须的软件安装部署好了
其实就非常简单了
只剩下码代码和debug
在这里插入图片描述
我这里就只放register.jsp(注册页面)的代码了
input的地址结合自己电脑修改

<%--
  Created by IntelliJ IDEA.
  User: 11861
  Date: 2020/10/29
  Time: 20:22
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
  <meta charset="utf-8">//UTF-8
  <title>注册洛谷</title>//标题
  <style type="text/css">
    span{
      color: crimson;
      font-size:  0.75rem;
    }
    .logo[data-v-a363f012] {
      width: 160px;
      display: block;
    }
    .motto[data-v-a363f012] {
      color: rgb(52, 152, 219);
      font-weight: 400;
      margin-bottom: 1.5em;
    }</style>//一些样式
</head>
<body>
<script type = "text/javascript">
  window.onload = function(){//名字验证
    var usernameSpan = document.getElementById("usernameError");
    var usernameError = document.getElementById("username");
    usernameError.onblur = function(){
      var usernameValue = usernameError.value;
      usernameValue = usernameValue.trim();
      if(usernameValue===""){
        usernameSpan.innerText= "用户名不能为空 ";
      }else {
        if (usernameValue.length < 6 || usernameValue.length > 12) {
          usernameSpan.innerText = "用户名长度必须大于6小于12";
        } else {
          var regExp = /^[A-Za-z0-9]+$/;//正则表达式
          var sym = regExp.test(usernameValue);
          if (sym) {
          } else {
            usernameSpan.innerText = "用户名只能由数字和字符组成";
          }
        }
      }
    }
    usernameError.onfocus = function (){//用户名错误,清空用户名,后面一样
      if(usernameSpan.innerText!=""){
        usernameError.value="";
      }
      usernameSpan.innerText="";
    }
    var password1 = document.getElementById("password1");
    var password1span = document.getElementById("passwordError1")
    password1.onblur = function(){
      var password1_value = password1.value;
      password1_value = password1_value.trim();
      if(password1_value===""){
        password1span.innerText= "密码不能为空 ";
      }else{
        if(password1_value.length<6||password1_value.length>12){
          password1span.innerText= "密码长度必须大于6小于12";
        }else{
          var regExp = /^[0-9]+$/;
          var sym = regExp.test(password1_value);
          if(!sym){}
          else{
            password1span.innerText= "密码至少且必须由数字和字符组成";
          }
        }
      }
    }
    password1.onfocus = function (){
      if(password1span.innerText!=""){
        password1.value="";
      }
      password1span.innerText="";
    }
    var password2span = document.getElementById("passwordError2");
    var password2 = document.getElementById("password2");
    password2.onblur = function(){
      var password1_value = password1.value;
      var password2_value = password2.value;
      if(password2_value===password1_value){
        password2span.innerText = "";
      }else{
        password2span.innerText = "二次密码不一致";
      }
    }
    password2.onfocus = function (){
      if(password2span.innerText!=""){
        password2.value="";
      }
      password2span.innerText="";
    }
    var email = document.getElementById("email");
    var emailspan = document.getElementById("emailError");
    email.onblur = function (){
      var email_value = email.value;
      var email_regExp  =/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
      var sym = email_regExp.test(email_value);
      if(sym){
      }else{
        emailspan.innerText = "邮箱不符合规范";
      }
    }
    email.onfocus = function (){
      if(emailspan.innerText!= ""){
        email.value="";
      }
      emailspan.innerText="";
    }

    var Submit_btn = document.getElementById("submit_btn");
    Submit_btn.onclick = function (){
      usernameError.focus();
      usernameError.blur();
      password1.focus();
      password1.blur()![在这里插入图片描述](https://img-blog.csdnimg.cn/20201103145018686.gif#pic_center)
;
      password2.focus();
      password2.blur();
      email.focus();
      email.blur();
      if(usernameSpan.innerText==""&&password1span.innerText==""&&password2span.innerText==""&&emailspan.innerText==""){
//无红字
        alert("开始注册");
        var User_form = document.getElementById("User");
        //User_form.hidden;
        User_form.submit();
      }
    }
  }

</script>
<div align="center">//放置中心
  <img data-v-a363f012="" data-v-796309f8="" src="https://cdn.luogu.com.cn/fe/logo.png?35e6d0796eab39c4bf304d03e6d332c0" class="logo"><br>
  <span data-v-a363f012="" data-v-796309f8="" class="motto">在洛谷,享受 Coding 的欢乐!</span>
<form id = "User" action="http://localhost:88/doRegister.jsp"  method="post">
  用户名<input type= "text" name = "username" id= "username" /><span id = "usernameError"></span><br>
  <span data-v-a363f012="" data-v-796309f8="" class="motto">使用 6 个或更多字符(字母、数字的组合)</span><br>
  密码 <input type="password" name = "password1" id = "password1" /><span id = "passwordError1"></span><br>
  确认密码<input type="password"  id = "password2" /><span id = "passwordError2"></span><br>
  <select id="sexValue" name="selectSex">
    <option value="">-->请选择性别<--</option>
    <option value="1">男性</option>
    <option value="0">女性</option>
  </select><br>
  电子邮箱<input type="text" name = "email" id = "email" /><span id = "emailError"></span><br>
  <input type="button" value=" 注册" id ="submit_btn"/>
  <input type="reset" value="重置"/>
</form>
</div>
</body>
</html>


源代码

GIthub主页选择Javaweb中web文件夹
(现在是码云了,国内好上去)
在这里插入图片描述

如果有所帮助的话,不嫌麻烦的话可以点个赞,进码云点个star

  • 9
    点赞
  • 16
    收藏
    觉得还不错? 一键收藏
  • 9
    评论
评论 9
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值