老师,我这里失去焦点了却没有显示

老师,我这里失去焦点了却没有显示

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>Index</title>

    <link rel="stylesheet" href="css/style.css">

</head>

<body>

<div id="Total">

    <div id="Title">-- 账户信息 --</div>

    <div class="item">

        <span class="important">*</span>

        <label for="userAccount">用户名 :</label>

        <input type="text" id="userAccount" placeholder=" 用户设置成功后不可修改">

    </div>

    <p class="item_"></p>

    <br>

    

    <div class="item">

        <span class="important">*</span>

        <label for="userPass">登陆密码 :</label>

        <input type="password" id="userPass" placeholder=" 6-20位字母,数字或符号">

    </div>

    <p class="item_"></p>

    <br>

    

    <div class="item">

        <span class="important">*</span>

        <label for="userPass_">确认密码 :</label>

        <input type="password" id="userPass_">

    </div>

    <p class="item_"></p>

    <br>

    

    <div class="item">

        <span class="important">*</span>

        <label for="userName">姓名 :</label>

        <input type="text" id="userName" placeholder=" 请输入姓名,中文且最多五位">

    </div>

    <p class="item_"></p>

    <br>

    

    <div class="item">

        <span class="important">*</span>

        <label for="information">身份证号 :</label>

        <input type="text" id="information" placeholder=" 请输入身份证号">

    </div>

    <p class="item_"></p>

    <br>

   

    <div class="item">

        <span class="important">*</span>

        <label for="email">邮箱 :</label>

        <input type="email" id="email" placeholder=" 请输入正确邮箱格式">

    </div>

    <p class="item_"></p>

    <br>

    

    <div class="item">

        <span class="important">*</span>

        <label for="telephone">手机号码 :</label>

        <input type="tel" id="telephone" placeholder=" 请输入您的手机号码">

    </div>

    <p class="item_"></p>

    <br>

   

    <div id="end">

        <input type="checkbox" id="choose">

        <label for="choose">我已阅读并同意遵守规定</label>

        <button id="handup">确认提交</button>

    </div>

</div>

</body>

</html>

<script src="index.js"></script>



// 获取元素

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


//用item作为存放提示信息的元素

var items=document.querySelectorAll(".itme_");//这是 一个集合,获取所有提示元素的下标

//当鼠标离开用户名输入框,产生验证

//一般验证是用正则,写全局变量,因为怕比较多

var reg=/正则/;

userAccount.onblur=function(){//验证用户名

    var reg=/^\w{6,18}$/;// \w表示数字字母下划线

    if(this.value==""){

      items[0].innerHTML="用户名称不能为空";

      items[0].style.color="red";

    }

}


正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

1回答
好帮手慕慕子 2020-03-22 10:22:04

同学你好,按下F12键打开控制台,测试代码出现如下报错,代码79行的位置,innerHTML方法未定义

http://img1.sycdn.imooc.com//climg/5e76caf1099620e110780118.jpg

原因:获取元素时的类名item_书写有误,没有获取到元素。

建议修改:

http://img1.sycdn.imooc.com//climg/5e76cb98099e481212860160.jpg

注意:老师这里显示的79行,同学那里不一定是79行,根据控制台现实的报错信息找到对应行进行修改就好了。

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

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
2.组件化网页开发
  • 参与学习           人
  • 提交作业       1121    份
  • 解答问题       14456    个

本阶段在运用JS实现动态网页开发的基础上,带你深入理解企业开发核心思想,完成一个企业级网页的开发,体验前端工程师的成就感。

了解课程
请稍等 ...
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师