新闻动态

innerHTM实现失焦判断方法

2020-04-10 14:53:30 admin 45

为了避免一些不友好的弹窗提示,使用失焦事件innerHTML给用户友好提示,在以后的项目用户注册板块都可以用得到,代码如下:

  <script>

  function validate()

  {

      document.getElementById("udiv").innerHTML="";

      document.getElementById("pdiv").innerHTML="";

      document.getElementById("adiv").innerHTML="";

      var isok = true;

      if(document.getElementById("userName").value=="")

      {

          document.getElementById("udiv").innerHTML="用户名不能为空";

          isok = false;

      }

      if(document.getElementById("passWord").value=="")

      {

          document.getElementById("pdiv").innerHTML="密码不能为空";

          isok = false;

      }

      if(document.getElementById("passWord").value.length<6)

      {

          document.getElementById("pdiv").innerHTML="密码长度不应小于6位";

          isok = false;

      }    

      if(document.getElementById("age").value=="")

      {

          document.getElementById("adiv").innerHTML="年龄不能为空";

          isok = false;

      }

      if(isNaN(document.getElementById("age").value))

      {

          document.getElementById("adiv").innerHTML="年龄必须为数字";

          isok = false;

      }

          return isok;

  }

  </script>

  <form action="2.html" name="frm" onsubmit="return validate()">

  用户名:<input type="text" name="userName"><span id="udiv"></span><br>

  密码:<input type="password" name="passWord"><span id="pdiv"></span><br>

  年龄:<input type="text" name="age"><span id="adiv"></span><br>

  <input type="submit" value="提 交">

  </form>