创建java后端数据库

创建数据库,并命名为travel

CREATE DATABASE travel

此处我以sqlyog来进行创建,如下

java数据库迁移纯java java转数据库开发_用户名

使用数据库

USE travel;

java数据库迁移纯java java转数据库开发_css_02

在travel创建本次项目所要使用到的表

我在项目中的travel.sql已提供建表语句,将其内容复制到sqlyog中执行即可

java数据库迁移纯java java转数据库开发_java数据库迁移纯java_03

执行后,若0 Error就说明建表成功

java数据库迁移纯java java转数据库开发_java数据库迁移纯java_04

如下是travel中的表

java数据库迁移纯java java转数据库开发_java数据库迁移纯java_05

java后端完成注册功能的编写

以下是实现注册功能,要完成的所有细节流程,如果你看不懂,没关系,可以先对这张图有个印象,后续写的代码,都会以此图为导向

java数据库迁移纯java java转数据库开发_css_06

现在我开始打开idea,准备开始编写代码

打开idea后,运行昨天写的项目时,发现报了如下错误

[ERROR] Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.1:compile (default-compile) on project travel: Error while storing the mojo status: E:\MyProject\Mytravel\travel\target\maven-status\maven-compiler-plugin\compile\default-compile\inputFiles.lst (拒绝访问。) -> [Help 1]

昨天能运行成功,但今天却运行不了,还真是奇怪,该错误说的是target目录中的一个文件被拒绝访问了,traget目录中的文件是maven在编译项目时自动生成的,那我可以将它删除,然后重新运行。

OK,问题已解决。

现在我就开始准备写注册的功能代码了

java数据库迁移纯java java转数据库开发_java数据库迁移纯java_07

java数据库迁移纯java java转数据库开发_css_08

当我点击注册时,应该对输入的内容进行校验,具体要校验的内容如下

表单校验:
   1.用户名:单词字符,长度8到20位
   2.密码:单词字符,长度8到20位
   3.email:邮件格式
   4.姓名:非空
   5.手机号:手机号格式
   6.出生日期:非空
   7.验证码:非空

在本次项目中,我只校验用户名,密码,email,剩下的你可以自己补齐。

在注册页面加载完毕后,监听form表单的submit

$(function () {
    //当表单提交时,调用所有的校验方法
    $("#registerForm").submit(function(){
	//1.发送数据到服务器
	if(checkUsername() && checkPassword() && checkEmail()){
	    //校验通过,发送ajax请求,提交表单的数据   username=zhangsan&password=123
        }
             //2.不让页面跳转
            return false;
            //如果这个方法没有返回值,或者返回为true,则表单提交,如果返回为false,则表单不提交
        });

    });
checkUsername()的实现
//单词字符,长度8到20位
function checkUsername() {
    //1.获取用户名值
	var username = $("#username").val();
	//2.定义正则
	var reg_username = /^\w{8,20}$/;
	
	//3.判断,给出提示信息
    var flag = reg_username.test(username);
    if(flag){
        //用户名合法
        $("#username").css("border","");
	}else{
        //用户名非法,加一个红色边框
		$("#username").css("border","1px solid red");
	}
    
    return flag;
}
checkPassword的实现
//校验密码
function checkPassword() {
    //1.获取密码值
    var password = $("#password").val();
    //2.定义正则
    var reg_password = /^\w{8,20}$/;

    //3.判断,给出提示信息
    var flag = reg_password.test(password);
    if(flag){
        //密码合法
        $("#password").css("border","");
    }else{
        //密码非法,加一个红色边框
        $("#password").css("border","1px solid red");
    }

    return flag;
}
checkEmail的实现
//校验邮箱
function checkEmail(){
    //1.获取邮箱
	var email = $("#email").val();
	//2.定义正则		itcast@163.com
	var reg_email = /^\w+@\w+\.\w+$/;

	//3.判断
	var flag = reg_email.test(email);
	if(flag){
        $("#email").css("border","");
	}else{
        $("#email").css("border","1px solid red");
	}

	return flag;
}

当输入框失去焦点时,此时也应该再次去校验输入框的内容是否正确

//当某一个组件失去焦点是,调用对应的校验方法
$("#username").blur(checkUsername);
$("#password").blur(checkPassword);
$("#email").blur(checkEmail);

如何获取表单中填写的数据

通过调用form对象的serialize(),可获取表单中所有填写的数据,获取到的数据格式如下

username=zhangsan&password=123

将表单中填写的数据发送到服务器上

此处采用ajax将数据发送到服务器上

$.post("registUserServlet",$(this).serialize(),function(data){
	//处理服务器响应的数据  data  {flag:true,errorMsg:"注册失败"}

	if(data.flag){
	    //注册成功,跳转成功页面
		location.href="register_ok.html";
	}else{
	    //注册失败,给errorMsg添加提示信息
		$("#errorMsg").html(data.errorMsg);

	}
});