实现当光标输入在输入输入框的时候,将后面的内容隐藏,例如在用户名称输入信息的时候,后面的用户名不能为空隐藏

我们来看看regist.js的代码:

  1. //该函数在html文档加载完成之后会调用
  2. $(function() {
  3. /*
  4. * 变量所有的错误信息,调用一个方法来决定是否显示错误信息
  5. * */
  6. $(".errorClass").each(function() {
  7. showError($(this));//$(this)表示当前遍历的对象
  8. });
  9.  
  10. //切换注册按钮的图片
  11. $("#submitBtn").hover(function () {
  12. //获得光标焦点
  13. $("#submitBtn").attr("src","/goods/images/regist2.jpg");
  14. },function(){
  15. //失去光标的焦点
  16. $("#submitBtn").attr("src","/goods/images/regist1.jpg");
  17.  
  18. });
  19.  
  20. //当输入框获得焦点的时候,隐藏label标签的内容
  21. $(".inputClass").focus(function() {
  22. //首先获得label标签的id
  23. var inputId = $(this).attr("id");
  24. var labelId = inputId+"Error";//label的id
  25. //清楚该标签的内容
  26. $("#"+labelId).text("");
  27. //让该标签不显示
  28. showError($("#"+labelId));
  29. });
  30.  
  31. });
  32.  
  33. //判断当前元素是否存在内容,存在显示,不存在不显示
  34. function showError( ele ){
  35. var text = ele.text();//获得该对象的文本值
  36. if(!text){
  37. ele.css("display","none");//让该对象消息
  38. }else{
  39. ele.css("display","");//显示对象
  40. }
  41.  
  42. }
  43.  
  44. //实现验证码图片的切换功能
  45. function changeVerifyCode() {
  46. $("#imgVerifyCode").attr("src","/goods/VerifyCodeServlet?a="+new Date().getTime());
  47. }

我们来看看程序运行的效果:

当在用户名输入框获得焦点的时候,后面的用户名不能为空就消失了

JavaWeb网上图书商城完整项目--day02-2.regist页面输入框得到焦点隐藏label的更多相关文章

  1. JavaWeb网上图书商城完整项目--day02-17.登录功能页面实现

    1.当在登陆页面点击登陆按钮的时候,会调用UserServlet的login方法,我们要在login.jsp中进行配置 2.要在login.jsp中处理Servlet在后台业务操作之后forward到 ...

  2. JavaWeb网上图书商城完整项目--day02-18.修改密码页面处理

    1.用户登陆成功之后会显示 当点击修改密码的时候,会进入下面的页面 对应的是pwd.jsp这个文件 我们把对jsp页面前段的校验都封装在pwd.js中,在jsp中引入该js文件 <%@ page ...

  3. JavaWeb网上图书商城完整项目--day02-4.regist页面提交表单时对所有输入框进行校验

    1.现在我们要将table表中的输入的参数全部提交到后台进行校验,我们提交我们是按照表单的形式提交,所以我们首先需要在table表外面添加一个表单 <%@ page language=" ...

  4. JavaWeb网上图书商城完整项目--24.注册页面的css样式实现

    现在框架已经做好了,即下来我们要对页面进行装饰了,第一步给每一个元素添加id 1.最外面的div添加id为divMain 2.第二个div添加id为divTitle,里面的span对应的id为span ...

  5. JavaWeb网上图书商城完整项目--过滤器解决中文乱码

    我们知道,如果是POST请求,我们需要调用request.setCharacterEncoding(“utf-8”)方法来设计编码:如果是GET请求,我们需要自己手动来处理编码问题.如果我们使用了En ...

  6. JavaWeb网上图书商城完整项目--13.项目所需环境的搭建

    1.首先安装mysql 创建项目所需的数据库,直接运行项目提供的goods.sql文库 2.myeclipse创建一个web project ,项目的名称是goods 把视频中提供的项目原型下的提供的 ...

  7. JavaWeb网上图书商城完整项目--BaseServlet

    1.以前进行操作的时候,例如我们进行登陆操作我们使用LoginServlet进行处理,进行注册操作我们使用RegisterServlet,很多业务的操作的时候我们就要定义很多个Servlet 有了Ba ...

  8. JavaWeb网上图书商城完整项目--day02-21.退出功能的实现

    1.当用户点击退出的时候,跳转到登陆页面 当用户点击退出的时候,需要将session中保存的登陆的用户销毁掉 当用户点击退出的时候,调用UserServlet的quit方法 退出按钮在top.jsp中 ...

  9. JavaWeb网上图书商城完整项目--day03-1.图书模块功能介绍及相关类创建

    1 前两天我们学习了user用户模块和图书的分类模块,接下来我们学习图书模块 图书模块的功能主要是下面的功能: 2 接下来我们创建对应的包 我们来看看对应的数据库表t_book CREATE TABL ...

  10. JavaWeb网上图书商城完整项目--day02-28.查询所有分类功能之left页面使用Q6MenuBar组件显示手风琴式下拉菜单

    首先页面去加载的时候,会去加载main.js文件,我们在加载left.jsp.top.jsp body.jsp,现在我们修改main.jsp的代码,让它去请求的时候去访问的是不在直接去访问left.j ...

随机推荐

  1. 遍历集合(Collection)的方法

    使用增强for循环和迭代器遍历集合 package com.aff.coll; import java.util.ArrayList; import java.util.Collection; imp ...

  2. ES6-面向对象即类

    简单介绍 在ES6面向对象基本上与java的类实现类似 1 class关键字,构造器和类分开了 1.1 ES5代码如下 <!DOCTYPE html> <html lang=&quo ...

  3. [前端开发]form-data和x-www-form-urlencoded的区别

    在后台开发时,之前做了文件的上传,用的是form-data,但并不知其区别.今天遇到了req.body为空的情况,切换成了x-www-form-urlencoded解决 form-data 就是htt ...

  4. Multiple annotations found at this line: - Undefined attribute name (charset).

    把 meta charset="UTF-8" 改为 meta http-equiv="Content-Type" content="text/html ...

  5. Python——day2

    学完今天我保证你自己可以至少写50行代码 明天,还在等你 回顾day1 小练习1: 小练习2: 小练习3: 好了激情的的一天已经过去了正式开始,day2的讲解         Day2 目录: 格式化 ...

  6. Java实现蓝桥杯 算法提高 盾神与积木游戏

    题目描述 最近的m天盾神都去幼儿园陪小朋友们玩去了~ 每个小朋友都拿到了一些积木,他们各自需要不同数量的积木来拼一些他们想要的东西.但是有的小朋友拿得多,有的小朋友拿得少,有些小朋友需要拿到其他 小朋 ...

  7. Java实现 蓝桥杯 算法训练 求平方和

    试题 算法训练 求平方和 问题描述 请用函数重载实现整型和浮点习型的两个数的平方和计算 输入格式 测试数据的输入一定会满足的格式. 2 2(2行2列,第1行整型,第2行浮点型) 输出格式 要求用户的输 ...

  8. Java实现 LeetCode 222 完全二叉树的节点个数

    222. 完全二叉树的节点个数 给出一个完全二叉树,求出该树的节点个数. 说明: 完全二叉树的定义如下:在完全二叉树中,除了最底层节点可能没填满外,其余每层节点数都达到最大值,并且最下面一层的节点都集 ...

  9. Java实现 LeetCode70 爬楼梯

    70. 爬楼梯 假设你正在爬楼梯.需要 n 阶你才能到达楼顶. 每次你可以爬 1 或 2 个台阶.你有多少种不同的方法可以爬到楼顶呢? 注意:给定 n 是一个正整数. 示例 1: 输入: 2 输出: ...

  10. java实现串的反转

    串的反转 反转串 我们把"cba"称为"abc"的反转串. 求一个串的反转串的方法很多.下面就是其中的一种方法,代码十分简洁(甚至有些神秘),请聪明的你通过给出 ...