老师帮忙看一下代码

来源:3-8 编程练习

贾海洋

2020-06-14 18:46:55

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>onblur和onfocus</title>

    <style type="text/css">

        .red{

     border:1px solid red;

     }

         .tip{

             float:left;

             display:none;

         }

         input{

             float:left;

        

         }

         span{

             float:left;

         }

    </style>

</head>

<body>

<span>姓名:</span><input type="text"> <span></span>

      <div class="tip" id="tip">请输入你的姓名</div>

<script type="text/javascript">

// 补充代码

var user=document.getElementsByTagName("input")[0];

var tip=document.getElementById("tip");

user.onfocus=function(){

    tip.style.display="block";     

}

user.onblur=function(){

    var userMes=this.value;

    if(userMes.length==0){

        tip.innerHTML="用户名不能为空";

        this.className="red";

    }

}

     

</script>

</body>

</html>


写回答

1回答

好帮手慕粉

2020-06-14

同学你好,代码实现的是有问题的,当输入了内容以后,提示就应该消失:

http://img.mukewang.com/climg/5ee600b4093d8d6d04370052.jpg

修改参考:

http://img.mukewang.com/climg/5ee6016609b7192507780459.jpg

如果我的回答帮助了你,欢迎采纳。祝学习愉快~

0

0 学习 · 40143 问题

查看课程