input常用的正则表达式验证

//html
  <form action="" method="post" name="myform">
                    <input type="text" name="userqiye" id="txtname" value="" placeholder="企业名称" onblur="Name()" />
                    <span id="span_qiye"></span>
                    <input type="text" name="username" id="txtnamea" value="" placeholder="姓名" onblur="Firm()" />
                    <span id="span_name"></span>
                    <input type="text" name="useriPhone" id="txt-ipone" value="" placeholder="电话" onblur="Ipone()" />
                    <span id="span_ipone"></span>
                    <input type="text" name="useremail" id="txtemail" value="" placeholder="邮箱" onblur="Email()" />
                    <span id="span_email"></span>

                    <textarea id="txt1"></textarea>
                    <input type="button" name="" id="btn" value="提交" class="btn" onclick="indep()"/>
                </form>

//第一种
//js
 function Name() {
        //验证企业名称
    var names = document.getElementById("span_qiye")
        var name = document.getElementById("txtname").value; 
        console.log(name)
        var nameReg = /^[\u4e00-\u9fa5]{6,}$/; 
        if (!nameReg.test(name)) {  
            names.innerHTML = "请输入6个汉字!"; //输入不合法,显示提示信息
            // console.log(names.innerHTML = "请输入2~6个汉字!")
    
            return false;
        }
        else {
            names.innerHTML = "格式正确"; //验证通过后提示
            return true;
        }
    }
    function Firm() {
        //验证姓名
        var names = document.getElementById("span_name")
        var name = document.getElementById("txtnamea").value; 
        console.log(name)
        var nameReg = /^[\u4e00-\u9fa5]{2,6}$/; 
        if (!nameReg.test(name)) {  
            names.innerHTML = "请输入2~6个汉字!"; //输入不合法,显示提示信息
            // console.log(names.innerHTML = "请输入2~6个汉字!")
            return false;
        }
        else {
            span_name.innerHTML = "格式正确"; //验证通过后提示
            return true;
        }
    }
    function Email() {
        //邮箱验证
        var email = document.getElementById("txtemail").value;
        console.log(email);
        var reg1 = /^[\w\d]{1,9}@[\w\d]{1,9}\.[\w]{2,3}$/;
        if (!reg1.test(email)) {
            span_email.innerHTML = "请输入正确邮箱!如:jack@163.com";
        }
        else {
            span_email.innerHTML = "格式正确";
        }
    }
    function Ipone() {
        //手机号验证
        var email = document.getElementById("txt-ipone").value;
        var reg1 = /^1[3456789]\d{9}$/;
        if (!reg1.test(email)) {
            span_ipone.innerHTML = "请输入正确的手机号";
        }
        else {
            span_ipone.innerHTML = "格式正确";
        }
    }




//第二种
 // 表单验证标识
  var qiyeValid, usernameValid, phoneValid, emailValid
window.onload = function () {
    var form = document.myform;
    var userqiye = form.userqiye; //form.name 属性名  姓名对应元素
    var username = form.username;
    var useriPhone = form.useriPhone;
    var useremail = form.useremail;



  userqiye.onblur = function () {
    var names = document.getElementById("span_qiye")
    var user_qiye = userqiye.value;
    console.log(user_qiye)
    var areaReg = /^[\u4e00-\u9fa5]{6,}$/;

    if (!areaReg.test(user_qiye)) {
      names.innerHTML = "请输入不少于6个汉字!"; //输入不合法,显示提示信息
      qiyeValid = false
      return false
    } else {
      span_qiye.innerHTML = "格式正确"; //验证通过后提示
      qiyeValid = true
      return true;
    }

  }

  username.onblur = function () {
    var names = document.getElementById("span_name")
    var user_name = username.value;
    var nameReg = /^[\u4e00-\u9fa5]{2,6}$/;
    if (!nameReg.test(user_name)) {
      names.innerHTML = "请输入2~6个汉字!";
      usernameValid = false
      return false;
    } else {
      names.innerHTML = "格式正确"; //验证通过后提示
      usernameValid = true
      return true;
    }
  }

  useriPhone.onblur = function () {
    var ipone = document.getElementById("span_ipone")
    var user_iphone = useriPhone.value;
    var reg1 = /^1[3456789]\d{9}$/;
    if (!reg1.test(user_iphone)) {
      ipone.innerHTML = "请输入11位数字";
      phoneValid = false
      return false;
    } else {
      ipone.innerHTML = "格式正确"; //验证通过后提示
      phoneValid = true
      return true;
    }
  }

  useremail.onblur = function () {
    var email = document.getElementById("span_email")
    var user_email = useremail.value;
    var reg2 = /^[\w\d]{1,9}@[\w\d]{1,9}\.[\w]{2,3}$/;
    if (!reg2.test(user_email)) {
      email.innerHTML = "请输入正确邮箱! 如:jack@163.com"
      emailValid = false
      return false;
    } else {
      email.innerHTML = "格式正确"; //验证通过后提示
      emailValid = true
      return true;
    }

  }

  
}


function indep() {
  if (qiyeValid && usernameValid && phoneValid && emailValid) {
    alert('提交成功')
  } else {
    if (!qiyeValid) {
      alert('请输入正确的企业名称');
    }
    if (!usernameValid) {
      alert('请输入正确的用户名');
    }
    if (!phoneValid) {
      alert('请输入正确的手机号');
    }
    if (!emailValid) {
      alert('请输入正确的邮箱');
    }
  }



}



有效数字
let reg = /^[+-]?(\d|([1-9]\d+))(\.\d+)?$/; 验证是否为有效数字
中文汉字
let reg = /^[\u4E00-\u9FA5]{2,}(·[\u4E00-\u9FA5]{2,})?$/ 
邮箱验证
let reg = /^\w+([-.]\w+)*@[A-Za-z0-9]+([-.][A-Za-z0-9]+)*(\.[A-Za-z0-9]+)$/; 邮箱验证
  • 0
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值