当前位置:首页 > Web开发 > 正文

Jquery实现检测用户输入用户名和暗码不能为空

2024-03-31 Web开发

<!DOCTYPE html>

 <html lang="zh-CN">

      <head> 

          <meta charset="UTF-8"> 

          <title>Title</title> 

    </head>

     <body>

     <!--设置用户名输入框--> 

     <label >用户名 <input id="t1" class=‘info‘ type="text">

     <!--空span标签用来后面绑定事件添加提示-->

      <span></span> 

    </label> 

    <hr> 

     <!--设置暗码输入框--> 

     <label >暗码 <input id="t2" class="info" type="password">

      <!--空span标签用来后面绑定事件添加提示--> 

      <span></span> 

    </label> 

    <hr> 

    <label id="b1"> <input type="button" value="登录"> </label> 


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

    <script> 

      // 按钮绑定点击事件

       $(‘#b1‘).click(function () { let $name=$(‘#t1‘); let $pwd=$(‘#t2‘); 

      // 按钮点击后查抄输入框是否为空,,为空则找到span便签添加提示 

      if ($name.val().length===0) { $name.next().text(‘用户名不能为空‘) }

      if($pwd.val().length===0) { $pwd.next().text(‘暗码不能为空‘) } });

    // 给输入框添加时间,获取焦点时,将span标签中的内容设置成空

        $(‘.info‘).focus(function () { $(this).next().text(‘‘); }) 

    </script> 

</body> 

</html>

Jquery实现检测用户输入用户名和暗码不能为空

温馨提示: 本文由Jm博客推荐,转载请保留链接: https://www.jmwww.net/file/web/30830.html