js的几种限制输入格式

任务一:

字段

规则及提示

用户名

1、不能为空

2、6~18位字符,只能包含英文字母、数字、下划线

密码

1、不能为空

2、6-16位字符,可包含数字,字母(区分大小写)

 

js代码:

function check(){
       var name = document.getElementById("uname").value;
       var pwd = document.getElementById("upwd").value;
       if(name==""){
                alert("用户名不能为空!");

                return false;
        }else if(name.length<6||name.length>18){
                alert("用户名只能为6~18位字符!");

                return false;
        }else{
              for(var i = 0; i<name.length; i++){
                     if(! ( name.charCodeAt(i)>='0'.charCodeAt()&&name.charCodeAt(i)<='9'.charCodeAt() ) ||
                           ( name.charCodeAt(i)>='a'.charCodeAt()&&name.charCodeAt(i)<='z'.charCodeAt() ) ||
                           ( name.charCodeAt(i)>='A'.charCodeAt()&&name.charCodeAt(i)<='Z'.charCodeAt() ) ||
                           ( name.charCodeAt(i)=='_'.charCodeAt() ) ) {
                                        alert("用户名只能包含英文字母、数字、下划线!");
                                         return false;
                        }
                  }
   }
       if(pwd==""){
               alert("密码不能为空!");

               return false;
          }else if(pwd.length<6||pwd.length>16){
                      alert("密码只能为6~16位字符!");

                       return false;
          }else{
                  for(var i = 0; i<pwd.length; i++){
                       if(! ( pwd.charCodeAt(i)>='0'.charCodeAt()&&pwd.charCodeAt(i)<='9'.charCodeAt() ) ||
                             ( pwd.charCodeAt(i)>='a'.charCodeAt()&&pwd.charCodeAt(i)<='z'.charCodeAt() ) ||
                             ( pwd.charCodeAt(i)>='A'.charCodeAt()&&pwd.charCodeAt(i)<='Z'.charCodeAt() ) ) {
                                      alert("密码只能包含英文字母、数字!");
                                      return false;
                          }
                    }
             }
   
                    return true;
    }

任务二:

字段

规则及提示

学号

1、不能为空

2、8数字,前面两位为入学年份,例如:14831102 代表该学生是14年入学的。

姓名

不能为空

性别

必选

出生日期

符合日期格式 例如:2008-01-01 2008/01/01 2008-1-1 2008/1/1

政治面貌

必选

入学年份

符合年份的格式 例如:1999 2000

籍贯

必选

特长

必选,如果选择 其他 ,则 文本框为必须填写。

备注

必输

js代码:

 <script type="text/javascript">
  function check() {
   var num = document.getElementById("num").value;
   var name = document.getElementById("name").value;
   var birthday = document.getElementById("birthday").value;
   var zhengzhi = document.getElementById("zhengzhi");
   var bysch = document.getElementById("bysch").value;
   var sheng = document.getElementById("sheng");
   var shi = document.getElementById("shi");
   var xian = document.getElementById("xian");
   var address = document.getElementById("address").value;
   
   var beizhu = document.getElementById("beizhu").value;
   
   //学号格式
   if(num==""){
    alert("学号不能为空!");
    return false;
   }else if(num.length!=8){
    alert("学号为8位!");
    return false;
   }else{
    for(var i = 0; i<num.length; i++){
     if(! ( num.charCodeAt(i)>='0'.charCodeAt() && num.charCodeAt(i)<='9'.charCodeAt() ) )
      {
       alert("学号只能是数字!");
       return false;
      }
    }
   }
   //姓名格式
   if(name==""){
    alert("姓名不能为空!");
    return false;
   }
   //出生日期格式
   if(birthday.length!=10){
    alert("出生日期格式不对!");
    return false;
   }else{
    var flag = true;
    for(var i = 0; i<4; i++){
     if(! ( birthday.charCodeAt(i)>='0'.charCodeAt()&&birthday.charCodeAt(i)<='9'.charCodeAt() ))
     {
      alert("出生日期格式不对!");
      flag = false;
      return false;
     }
    }
    if(flag){
     for(var i = 5; i<7; i++){
      if(! ( birthday.charCodeAt(i)>='0'.charCodeAt()&&birthday.charCodeAt(i)<='9'.charCodeAt() ))
      {
       alert("出生日期格式不对!");
       flag = false;
       return false;
      }
     }
     for(var i = 8; i<10; i++){
      if(! ( birthday.charCodeAt(i)>='0'.charCodeAt()&&birthday.charCodeAt(i)<='9'.charCodeAt() ))
      {
       alert("出生日期格式不对!");
       flag = false;
       return false;
      }
     }
     if(!( (birthday.charCodeAt(4)=='-'.charCodeAt()&&birthday.charCodeAt(7)=='-'.charCodeAt())||
        (birthday.charCodeAt(4)=='/'.charCodeAt()&&birthday.charCodeAt(7)=='/'.charCodeAt()) )){
       alert("出生日期格式不对!");
       return false;
      }
    }
   }
   
   //政治面貌
   if(zhengzhi.value == ""){
    alert("请选择您的政治面貌");
    return false;
   }
   
   //入学年份格式
   if(bysch.length!=4){
    alert("入学年份格式格式不对!");
    return false;
   }else{
    for(var i = 0; i<bysch.length; i++){
     if(! ( bysch.charCodeAt(i)>='0'.charCodeAt()&&bysch.charCodeAt(i)<='9'.charCodeAt() ))
     {
      alert("入学年份格式不对!");
      return false;
     }
    }
   }
   
   //籍贯
   if(sheng.value == ""){
    alert("请选择您的籍贯省");
    return false;
   }
   if(shi.value == ""){
    alert("请选择您的籍贯市");
    return false;
   }
   if(xian.value == ""){
    alert("请选择您的籍贯县/区");
    return false;
   }
   if(address == ""){
    alert("请输入您的籍贯地址");
    return false;
   }
   
   //特长
   if( !( (document.getElementById("book").checked) || (document.getElementById("paint").checked) ||
    (document.getElementById("write").checked) || (document.getElementById("sport").checked) ||
    (document.getElementById("other").checked) )){
     alert("请选择您的特长!");
     return false;
   }
   if(document.getElementById("other").checked ){
    if(document.getElementById("others").value == ""){
     alert("请输入您的其他特长!");
     return false;
    }
   }
   
   //备注
   if(beizhu==""){
    alert("备注不能为空!");
    return false;
   }
  
   return true;
  }
  
 </script>

form表单:

<form οnsubmit="return check()">
   学    号<input type="text" id="num" name="num" ><br>
   姓    名<input type="text" id="name" name="name"><br>
   性    别<input type="radio" id="sex" name="sex" value="男" checked="checked" >男
    <input type="radio" id="sex" name="sex" value="女" >女<br>
   出生日期<input type="text" id="birthday" name="birthday" ><br>
   政治面貌
    <select id="zhengzhi" name="zhengzhi">
     <option value="">请选择</option>
     <option value="1">中共党员</option>
     <option value="2">共青团员</option>
    </select><br>
 入学年份<input type="text" id="bysch" name="bysch"><br>
 籍    贯
  <select id="sheng" name="sheng">
     <option value="">请选择省</option>
     <option value="1">山东省</option>
     <option value="2">江苏省</option>
    </select>
    <select id="shi" name="shi">
     <option value="">请选择市</option>
     <option value="1">济南市</option>
     <option value="2">淄博市</option>
    </select>
    <select id="xian" name="xian">
     <option value="">请选择县/区</option>
     <option value="1">张店区</option>
     <option value="2">淄川区</option>
    </select><br>
    <input type="text" id="address" name="address"><br>
    
 特    长
  <input type="checkbox" name="tech" id="book" value="书法" >书法
  <input type="checkbox" name="tech" id="paint" value="绘画" >绘画
  <input type="checkbox" name="tech" id="write" value="写作" >写作
  <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  <input type="checkbox" name="tech" id="sport" value="体育" >体育
  <input type="checkbox" name="tech" id="other" value="其他" >其他
  <input type="text" id="others" name="others" ><br>
 备    注
  <textarea rows="" cols="" id="beizhu" name="beizhu"></textarea><br>
  <input type="submit" id="add" name="add" value="添加">
  <input type="reset" value="清除">
   </form>

 

  • 2
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值