java网上图书商城(1)User模块

 更新时间:2016年12月05日 09:05:54   作者:ganchuanpu  
这篇文章主要介绍了java网上图书商城,User模块,实现用户注册功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了java网上图书商城user模块代码,供大家参考,具体内容如下

效果图:

regist.js

$(function() {
 /*
 * 1. 得到所有的错误信息,循环遍历之。调用一个方法来确定是否显示错误信息!
 */
 $(".errorClass").each(function() {
 showError($(this));//遍历每个元素,使用每个元素来调用showError方法
 });
 
 /*
 * 2. 切换注册按钮的图片
 */
 $("#submitBtn").hover(
 function() {
  $("#submitBtn").attr("src", "/goods/images/regist2.jpg");
 },
 function() {
  $("#submitBtn").attr("src", "/goods/images/regist1.jpg");
 }
 );
 
 /*
 * 3. 输入框得到焦点隐藏错误信息
 */
 $(".inputClass").focus(function() {
 var labelId = $(this).attr("id") + "Error";//通过输入框找到对应的label的id
 $("#" + labelId).text("");//把label的内容清空!
 showError($("#" + labelId));//隐藏没有信息的label
 });
 
 /*
 * 4. 输入框失去焦点进行校验
 */
 $(".inputClass").blur(function() {
 var id = $(this).attr("id");//获取当前输入框的id
 var funName = "validate" + id.substring(0,1).toUpperCase() + id.substring(1) + "()";//得到对应的校验函数名
 eval(funName);//执行函数调用
 });
 
 /*
 * 5. 表单提交时进行校验
 */
 $("#registForm").submit(function() {
 var bool = true;//表示校验通过
 if(!validateLoginname()) {
  bool = false;
 }
 if(!validateLoginpass()) {
  bool = false;
 }
 if(!validateReloginpass()) {
  bool = false;
 }
 if(!validateEmail()) {
  bool = false;
 }
 if(!validateVerifyCode()) {
  bool = false;
 }
 
 return bool;
 });
});

/*
 * 登录名校验方法
 */
function validateLoginname() {
 var id = "loginname";
 var value = $("#" + id).val();//获取输入框内容
 /*
 * 1. 非空校验
 */
 if(!value) {
 /*
  * 获取对应的label
  * 添加错误信息
  * 显示label
  */
 $("#" + id + "Error").text("用户名不能为空!");
 showError($("#" + id + "Error"));
 return false;
 }
 /*
 * 2. 长度校验
 */
 if(value.length < 3 || value.length > 20) {
 /*
  * 获取对应的label
  * 添加错误信息
  * 显示label
  */
 $("#" + id + "Error").text("用户名长度必须在3 ~ 20之间!");
 showError($("#" + id + "Error"));
 false;
 }
 /*
 * 3. 是否注册校验
 */
 $.ajax({
 url:"/goods/UserServlet",//要请求的servlet
 data:{method:"ajaxValidateLoginname", loginname:value},//给服务器的参数
 type:"POST",
 dataType:"json",
 async:false,//是否异步请求,如果是异步,那么不会等服务器返回,我们这个函数就向下运行了。
 cache:false,
 success:function(result) {
  if(!result) {//如果校验失败
  $("#" + id + "Error").text("用户名已被注册!");
  showError($("#" + id + "Error"));
  return false;
  }
 }
 });
 return true;
}

/*
 * 登录密码校验方法
 */
function validateLoginpass() {
 var id = "loginpass";
 var value = $("#" + id).val();//获取输入框内容
 /*
 * 1. 非空校验
 */
 if(!value) {
 /*
  * 获取对应的label
  * 添加错误信息
  * 显示label
  */
 $("#" + id + "Error").text("密码不能为空!");
 showError($("#" + id + "Error"));
 return false;
 }
 /*
 * 2. 长度校验
 */
 if(value.length < 3 || value.length > 20) {
 /*
  * 获取对应的label
  * 添加错误信息
  * 显示label
  */
 $("#" + id + "Error").text("密码长度必须在3 ~ 20之间!");
 showError($("#" + id + "Error"));
 false;
 }
 return true; 
}

/*
 * 确认密码校验方法
 */
function validateReloginpass() {
 var id = "reloginpass";
 var value = $("#" + id).val();//获取输入框内容
 /*
 * 1. 非空校验
 */
 if(!value) {
 /*
  * 获取对应的label
  * 添加错误信息
  * 显示label
  */
 $("#" + id + "Error").text("确认密码不能为空!");
 showError($("#" + id + "Error"));
 return false;
 }
 /*
 * 2. 两次输入是否一致校验
 */
 if(value != $("#loginpass").val()) {
 /*
  * 获取对应的label
  * 添加错误信息
  * 显示label
  */
 $("#" + id + "Error").text("两次输入不一致!");
 showError($("#" + id + "Error"));
 false;
 }
 return true; 
}

/*
 * Email校验方法
 */
function validateEmail() {
 var id = "email";
 var value = $("#" + id).val();//获取输入框内容
 /*
 * 1. 非空校验
 */
 if(!value) {
 /*
  * 获取对应的label
  * 添加错误信息
  * 显示label
  */
 $("#" + id + "Error").text("Email不能为空!");
 showError($("#" + id + "Error"));
 return false;
 }
 /*
 * 2. Email格式校验
 */
 if(!/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(value)) {
 /*
  * 获取对应的label
  * 添加错误信息
  * 显示label
  */
 $("#" + id + "Error").text("错误的Email格式!");
 showError($("#" + id + "Error"));
 false;
 }
 /*
 * 3. 是否注册校验
 */
 $.ajax({
 url:"/goods/UserServlet",//要请求的servlet
 data:{method:"ajaxValidateEmail", email:value},//给服务器的参数
 type:"POST",
 dataType:"json",
 async:false,//是否异步请求,如果是异步,那么不会等服务器返回,我们这个函数就向下运行了。
 cache:false,
 success:function(result) {
  if(!result) {//如果校验失败
  $("#" + id + "Error").text("Email已被注册!");
  showError($("#" + id + "Error"));
  return false;
  }
 }
 });
 return true; 
}

/*
 * 验证码校验方法
 */
function validateVerifyCode() {
 var id = "verifyCode";
 var value = $("#" + id).val();//获取输入框内容
 /*
 * 1. 非空校验
 */
 if(!value) {
 /*
  * 获取对应的label
  * 添加错误信息
  * 显示label
  */
 $("#" + id + "Error").text("验证码不能为空!");
 showError($("#" + id + "Error"));
 return false;
 }
 /*
 * 2. 长度校验
 */
 if(value.length != 4) {
 /*
  * 获取对应的label
  * 添加错误信息
  * 显示label
  */
 $("#" + id + "Error").text("错误的验证码!");
 showError($("#" + id + "Error"));
 false;
 }
 /*
 * 3. 是否正确
 */
 $.ajax({
 url:"/goods/UserServlet",//要请求的servlet
 data:{method:"ajaxValidateVerifyCode", verifyCode:value},//给服务器的参数
 type:"POST",
 dataType:"json",
 async:false,//是否异步请求,如果是异步,那么不会等服务器返回,我们这个函数就向下运行了。
 cache:false,
 success:function(result) {
  if(!result) {//如果校验失败
  $("#" + id + "Error").text("验证码错误!");
  showError($("#" + id + "Error"));
  return false;
  }
 }
 });
 return true; 
}

/*
 * 判断当前元素是否存在内容,如果存在显示,不页面不显示!
 */
function showError(ele) {
 var text = ele.text();//获取元素的内容
 if(!text) {//如果没有内容
 ele.css("display", "none");//隐藏元素
 } else {//如果有内容
 ele.css("display", "");//显示元素
 }
}

/*
 * 换一张验证码
 */
function _hyz() {
 /*
 * 1. 获取<img>元素
 * 2. 重新设置它的src
 * 3. 使用毫秒来添加参数
 */
 $("#imgVerifyCode").attr("src", "/goods/VerifyCodeServlet?a=" + new Date().getTime());
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • 配置Ant执行Jmeter脚本过程详解

    配置Ant执行Jmeter脚本过程详解

    这篇文章主要介绍了配置Ant执行Jmeter脚本过程详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-09-09
  • Maven的安装配置详解

    Maven的安装配置详解

    这篇文章主要介绍了Maven的安装配置详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-08-08
  • SpringBoot后端验证码的实现示例

    SpringBoot后端验证码的实现示例

    为了防止网站的用户被通过密码典爆破,引入验证码的功能是十分有必要的,本文主要介绍了SpringBoot后端验证码的实现示例,具有一定的参考价值,感兴趣的可以了解一下
    2024-08-08
  • java通过PDF模板填写PDF表单

    java通过PDF模板填写PDF表单

    这篇文章主要为大家详细介绍了java通过PDF模板填写PDF表单,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-10-10
  • SpringBoot集成WebSocket遇到的问题及解决

    SpringBoot集成WebSocket遇到的问题及解决

    这篇文章主要介绍了SpringBoot集成WebSocket遇到的问题及解决方案,具有很好的参考价值,希望对大家有所帮助。
    2023-07-07
  • MyBatisPlus查询投影与查询条件详细讲解

    MyBatisPlus查询投影与查询条件详细讲解

    这篇文章主要介绍了MyBatisPlus DQL编程控制中的查询投影、查询条件,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-08-08
  • Java图片处理的简易指南

    Java图片处理的简易指南

    图像处理是各类应用程序的重要组成部分,Java作为一种多功能且强大的编程语言,提供了丰富的库和框架来高效地处理图像处理任务,本文将带您了解Java图像处理的基本概念、工具以及实践示例,帮助您掌握Java图像处理技术,需要的朋友可以参考下
    2024-09-09
  • 关于maven:pom文件的使用解析

    关于maven:pom文件的使用解析

    这篇文章主要介绍了关于maven:pom文件的使用说明,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-08-08
  • 解决SpringBoot请求返回字符串中文乱码的问题

    解决SpringBoot请求返回字符串中文乱码的问题

    这篇文章主要介绍了解决SpringBoot请求返回字符串中文乱码的问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-05-05
  • SpringBoot整合Graylog做日志收集实现过程

    SpringBoot整合Graylog做日志收集实现过程

    这篇文章主要为大家介绍了SpringBoot整合Graylog做日志收集实现过程详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-12-12

最新评论