zoukankan      html  css  js  c++  java
  • JavaWeb网上图书商城完整项目--day02-2.regist页面输入框得到焦点隐藏label

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

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

    //该函数在html文档加载完成之后会调用
    $(function() {
        /*
         * 变量所有的错误信息,调用一个方法来决定是否显示错误信息
         * */
        $(".errorClass").each(function() {
            showError($(this));//$(this)表示当前遍历的对象
        });
        
        
        //切换注册按钮的图片
        $("#submitBtn").hover(function () {
            //获得光标焦点
            $("#submitBtn").attr("src","/goods/images/regist2.jpg");
        },function(){
            //失去光标的焦点
            $("#submitBtn").attr("src","/goods/images/regist1.jpg");
            
            
        });
        
        //当输入框获得焦点的时候,隐藏label标签的内容
        $(".inputClass").focus(function() {
            //首先获得label标签的id
            var inputId = $(this).attr("id");
            var labelId = inputId+"Error";//label的id
            //清楚该标签的内容
            $("#"+labelId).text("");
            //让该标签不显示
            showError($("#"+labelId));
        });
        
    });
    
    //判断当前元素是否存在内容,存在显示,不存在不显示
    function showError( ele ){
        var text = ele.text();//获得该对象的文本值
        if(!text){
            ele.css("display","none");//让该对象消息
        }else{
            ele.css("display","");//显示对象
        }
    
    }
    
    //实现验证码图片的切换功能
    function changeVerifyCode() {
        $("#imgVerifyCode").attr("src","/goods/VerifyCodeServlet?a="+new Date().getTime());
    }

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

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

  • 相关阅读:
    apache配置虚拟主机的三种方式
    mysql ddl语句
    MySQL锁机制
    如何卸载rpm包
    RAC SCAN
    oracle rac scan ip 用途 原理
    如何用udev for asm in oracle linux 6
    ORACLE RAC NTP 时间服务器配置
    对表空间 'USERS' 无权限
    bootstrap全局css样式
  • 原文地址:https://www.cnblogs.com/kebibuluan/p/6802534.html
Copyright © 2011-2022 走看看