專案小結:手機郵箱正則,URL各種判斷返回頁面,input輸入框輸入符合卻獲取不到問題
1.手機郵箱正則
近兩年出來很多新號碼,聽說199什麼的都有了- -導致以前的正則不能用了....這就很難過,總是過一段時間出一種新號碼。因此,我決定使用返樸歸真的手機正則。
手機正則:var reg=/^1[0-9]\d{9}$/;
郵箱正則:var mailReg = /^[a-zA-Z0-9_.-][email protected][a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/;
使用方法:reg.test(e)
除此之外,作為一隻程式狗,耿直的認為輸入空格就是錯誤的,但是產品和測試都說萬一使用者就輸入空格了,然後我報錯了,但是肉眼看不到空格,使用者找不到錯誤,體驗就很差!哎,為了照顧那些手殘使用者,必須在正則判斷前用 trim()對欄位做處理trim()、trim()、trim()、trim()、trim()~~~~~~
2.input輸入框輸入符合卻獲取不到問題
當input輸入框設定成type為number的時候,程式狗的思維是,這種輸驗證碼之類的輸入框不都應該輸入數字嗎?BUT,測試妹子就喜歡輸入一堆符號+英文,別問我為什麼能輸入,(因為在不做限制的情況下,用中文輸入法,然後按回車鍵就可以輸入- -。),然後W3C制定的語法裡,number輸入框裡有符號的時候,value 為空。emmm,這個也別問為什麼,我TM也很鬱悶。最後導致,測試妹子輸入一堆符號後提交的時候提示,該欄位不能為空,測試妹子就說了,我這明明不是空的,卻提示為空,這不符合常理。好....我改.....
首先試用tel的type,因為這個type可以讓安卓和IOS都呼叫數字鍵盤,然後給input框都加上限制只能輸入數字:
限制正整數:<input type="tel" placeholder="請填寫驗證碼" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')" />
限制首位不為0的正整數:<input type="tel" placeholder="請填寫手機號" onkeyup="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')}" />
3.URL各種判斷返回頁面
案例:一個頁面,在不同的情況下點返回上一頁的時候進入不同的頁面。
作為一個前端,我想到的最簡單的辦法就是在URL里加不同的引數,然後獲取欄位的值去判斷進入哪個頁面。
方法一:正則分析法
複製程式碼程式碼如下:
function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null;
}
呼叫方法:
alert(GetQueryString("引數名1"));alert(GetQueryString("引數名2"));
alert(GetQueryString("引數名3"));
方法二
複製程式碼程式碼如下:
<Script language="javascript">
function GetRequest() {
var url = location.search; //獲取url中"?"符後的字串
var theRequest = new Object();
if (url.indexOf("?") != -1) {
var str = url.substr(1);
strs = str.split("&");
for(var i = 0; i < strs.length; i ++) {
theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);
}
}
return theRequest;
}
</Script>
呼叫方法:
<Script language="javascript">
var Request = new Object();
Request = GetRequest();
var 引數1,引數2,引數3,引數N;
引數1 = Request['引數1'];
引數2 = Request['引數2'];
引數3 = Request['引數3'];
引數N = Request['引數N'];
</Script>