1.姓名只能是漢字

var nameCheck =/^[\u4e00-\u9fa5]{2,21}$/;
if(!nameCheck .test(name)){ 
    alert("輸入的'姓名'中含有非漢字字元!"); 
    return false; 
         }

2.簡單的身份證校驗（校驗內容包括數字，位數，以及末尾的x,X）

var idNoCheck = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
if(!idNoCheck .test(idNo)){ 
    alert("輸入的'身份證號碼'不合法!"); 
    return false; 
        }
 

3.簡單的手機號碼校驗（號碼第二位可以參考運營商定義的號段）

var phoneNoCheck = /^(1[0-9]{10})$/;
if(!phoneNoCheck .test(phoneNo )){
    alert("輸入的'手機號碼'不合法!");
    return false;
        }

4.簡單的地址防特殊字元校驗

var specialKey = "[`·~!$^&*()=|{}':;'\\[\\].<>/?~！￥……&*（）——|{}【】‘；：”“'。、？]‘'";//去掉#和，
for(var i = 0; i < specialKey.length; i++) {
    if(address.indexOf(specialKey[i]) != -1){
        alert("輸入的'地址'含有非法字元!");
        return false;
           }
       }
 

5.特殊鍵位禁止輸入

function checkKeys() {
        if (( event.keyCode > 32 && event.keyCode < 48) ||
            ( event.keyCode > 57 && event.keyCode < 65) ||
            ( event.keyCode > 90 && event.keyCode < 97)
           ) {
                event.returnValue = false;
           }  
    }
 

6.文字域長度簡單控制

<td>
   <textarea cols="25" rows="5" name="AA" id="AA" onpropertychange="if(value.length>100) value=value.substr(0,100)" >BB</textarea>
</td>

7.賬號位數和非空的判斷控制

//登陸密碼輸入控制：非空
//賬號 必須五位
function sLoginPwCtrl(obj){
    
    var sloginPw = document.getElementById("SuppwCtrl").value;//獲得密碼輸入框中的值
    var superAcc = document.getElementById("SupAccCtrl").value;//獲得賬號輸入框中的值
    
    //情況1，使用者不輸入賬號，那麼讓提交按鈕失效並返回一個提示到lable標籤
    if( superAcc == null || superAcc == "" || superAcc == undefined ){
        document.getElementById('sloginSub').disabled = true;
        document.getElementById('sloginlable1').innerHTML = "請輸入賬戶";
        sLoginPwCtrl(this);
    } 
    //情況2，使用者輸入賬號位數步符合要求，那麼讓提交按鈕失效並返回一個提示到lable標籤
    else if( superAcc.length != 5 ){
        document.getElementById('sloginSub').disabled = true;
        document.getElementById('sloginlable1').innerHTML = "賬戶非法";
        sLoginPwCtrl(this);
    }
    //情況3，使用者輸入步輸入密碼，那麼讓提交按鈕失效並返回一個提示到lable標籤
    else if( sloginPw == null || sloginPw == "" || sloginPw == undefined ){
        document.getElementById('sloginSub').disabled = true;
        document.getElementById('sloginlable2').innerHTML = "請輸入密碼";
        sLoginPwCtrl(this);
    }
    //排除不合法操作後的其他操作，按鈕有效，並清其操作留下的提醒
    else{
        document.getElementById('sloginSub').disabled = false;
        document.getElementById('sloginlable').innerHTML = "";
    }
}

8.僅僅能輸入8位數字的輸入控制

<!--僅僅能輸入8位數字的輸入控制-->
function check(obj){
    var maxChars = 8;
    if(isNaN(obj.value)){
        document.getElementById('kahaolable').innerHTML = "*卡號只能是數字";
        document.getElementById('sub').disabled = true;
    }
    else if(obj.value.length != maxChars){
        document.getElementById('kahaolable').innerHTML = "*卡號應為8位數字";
        document.getElementById('sub').disabled = true;
    }
    else{
        document.getElementById('sub').disabled = false;
         document.getElementById('kahaolable').innerHTML = "";
         var inputValue = document.getElementById("demo1").value;
         obj.value = inputValue;
    }
}

9.修改密碼輸入控制

//修改密碼控制
function upPswIn(obj){
    
    var myvalue1 = document.getElementById("upYuan").value;
    var myvalue2 = document.getElementById("upNew1").value;
    var myvalue3 = document.getElementById("upNew2").value;
    
    if( myvalue1 == null || myvalue1 == "" ){
        document.getElementById('upPwSub').disabled = true;
        document.getElementById('upLable1').innerHTML = "請正確輸入原密碼";
        upPswIn(this);
    }
    else if( myvalue2 == null || myvalue2 == "" || myvalue2 == undefined ){
        document.getElementById('upPwSub').disabled = true;
        document.getElementById('upLable1').innerHTML = "";
        document.getElementById('upLable2').innerHTML = "請輸入新密碼";
        upPswIn(this)
    }
    else if( myvalue3 == null || myvalue3 == "" || myvalue3 == undefined ){
        document.getElementById('upPwSub').disabled = true;
        document.getElementById('upLable1').innerHTML = "";
        document.getElementById('upLable2').innerHTML = "";
        document.getElementById('upLable3').innerHTML = "請再次輸入新密碼";
        upPswIn(this)
    }
    else 
    if( myvalue2 != myvalue3){
        document.getElementById('upPwSub').disabled = true;
        document.getElementById('upLable2').innerHTML = "兩次密碼不一致";
        upPswIn(this)
    }
    else{
        document.getElementById('upPwSub').disabled = false;
        document.getElementById('upLable1').innerHTML = "";
        document.getElementById('upLable2').innerHTML = "";
        document.getElementById('upLable3').innerHTML = "";
    }  
}    

最後

為了幫助大家讓學習變得輕鬆、高效，給大家免費分享一大批資料，幫助大家在成為全棧工程師，乃至架構師的路上披荊斬棘。在這裡給大家推薦一個前端全棧學習交流圈：866109386.歡迎大家進群交流討論，學習交流，共同進步。

當真正開始學習的時候難免不知道從哪入手，導致效率低下影響繼續學習的信心。

但最重要的是不知道哪些技術需要重點掌握，學習時頻繁踩坑，最終浪費大量時間，所以有有效資源還是很有必要的。

最後祝福所有遇到瓶疾且不知道怎麼辦的前端程式設計師們，祝福大家在往後的工作與面試中一切順利。