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());
    }

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

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

  • 相关阅读:
    [机器人仿真软件(一)]V-REP与MATLAB进行通讯的方法
    TCP接收非法数据0xFFF4FFFD06的问题
    std::numeric_limits::epsilon
    linux 设置默认网关
    更换pip源
    实时屏幕传输
    安装node
    window 添加服务
    数据集格式
    jupyter 设置密码
  • 原文地址:https://www.cnblogs.com/kebibuluan/p/6802534.html
Copyright © 2011-2022 走看看