JS 验证输入框内容

效验用户名输入是否符合数据要求

1. 声明一个方法
2. 定位到元素 元素为 Name()时 要先声明才可以方便下面调用
3. 获取到输入的数据
4. 使用正则表达写出效验标准
5. 用获取到的数据和标准作出比较
6. 用IF判断逻辑标准
7. 符合要求的不提醒 需要定位到显示提醒内容的ID位置
8. 不符合的要求给出提示语

效验用户名输入是否符合数据要求 */
 //1.声明一个方法
 function checkname(){
//2.定位到元素   元素为 Name()时 要先声明才可以方便下面调用
  var a= document.getElementsByName("username")
  var b=a[0];
//3.获取到输入的数据  
  var c=b.value;
//4. 正则表达写出效验标准
  var d =/^[a-zA-Z0-9_-]{4,16}$/;
//5.用获取到的数据和标准作出比较
  var e=d.test(c)
//6.判断的逻辑标准
  if(e){
//7.符合要求的不提醒   定位到要显示的ID位置    
      document.getElementById("f").innerHTML=""/
  }else{
// 8.不符合的要求给出提示语      
      document.getElementById("f").innerHTML="4到16位（字母，数字，下划线，"/
  }
}

当我们输入错误时就可以得到下面的提示

image.png