值得收藏的八個(gè)常用的js正則表達(dá)式
開發(fā)中如果有input輸入框,難免就要寫正則表達(dá)式,因此在這里總結(jié)了一些常見常用的正則表達(dá)式的書寫方法,希望會(huì)大家有所幫助;
附圖:

一.手機(jī)號(hào)碼
$(document).ready(function(){
//判斷輸入手機(jī)號(hào)碼是否正確
$("#telephone").focus(function(){
document.getElementById("ph-hint").innerHTML = ":open_mouth:請(qǐng)輸入11位手機(jī)號(hào)碼";
})
$("#telephone").blur(function(){
if(/^((13[0-9])|(15[^4,\D])|(18[0-9]))\d{8}$/.test(this.value)){
document.getElementById("ph-hint").innerHTML = "";
}else if(document.getElementById("telephone").value == ""){
document.getElementById("ph-hint").innerHTML = " 咦,手機(jī)號(hào)不能為空哦";
}else{
document.getElementById("ph-hint").innerHTML = " 這好像不是一個(gè)手機(jī)號(hào)碼哦";
document.getElementById("telephone").value = "";
}
})
})
詳解:當(dāng)獲取焦點(diǎn)時(shí),提示文字請(qǐng)輸入手機(jī)號(hào),然后失去焦點(diǎn)時(shí)判斷,那段正則表達(dá)式表示的是13幾,這個(gè)幾0-9都可以,或者15幾,但是非4的都行,或者18幾,0-9都可以,然后再加8位數(shù)字,符合條件則成功,否則根據(jù)情況判斷提示文字;
二.密碼
$(document).ready(function(){
//判斷輸入密碼格式是否正確
$("#setpassword").focus(function(){
document.getElementById("pw-hint").innerHTML = ":open_mouth:請(qǐng)您輸入密碼,6-15個(gè)字母數(shù)字和符號(hào)兩種以上組合";
})
$("#setpassword").blur(function(){
if(/^(?![0-9]+$)(?![a-z]+$)(?![A-Z]+$)(?![,\.#%'\+\*\-:;^_`]+$)[,\.#%'\+\*\-:;^_`0-9A-Za-z]{6,15}$/.test(this.value)){
document.getElementById("pw-hint").innerHTML = "";
}else if(document.getElementById("setpassword").value == ""){
document.getElementById("pw-hint").innerHTML = " 咦,密碼不能為空哦";
}else{
document.getElementById("pw-hint").innerHTML = " 你的密碼格式有誤,請(qǐng)重新輸入";
document.getElementById("setpassword").value = "";
}
})
})
詳解:當(dāng)獲取焦點(diǎn)時(shí),提示文字請(qǐng)輸入密碼,然后失去焦點(diǎn)時(shí)判斷,那段正則表達(dá)式表示的是可以輸入0-9的數(shù)字和大小寫的字母a-z,外加一些特殊符號(hào),然后可以輸入6-15位密碼,符合條件則成功,否則根據(jù)情況判斷提示文字;
*以下格式我就不這樣寫了,簡(jiǎn)介一點(diǎn),上面兩段可以去參考。
三.用戶名
//用戶名正則,4到16位(字母,數(shù)字,下劃線,減號(hào))
var username = /^[a-zA-Z0-9_-]{4,16}$/;
//文字
var username=/[\d]/g;
四.電子郵箱
//對(duì)電子郵件的驗(yàn)證
var email = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
五.身份證號(hào)
//身份證號(hào)(18位)正則
var cP = /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
六.日期
//日期正則,簡(jiǎn)單判定,未做月份及日期的判定
var time = /^\d{4}(\-)\d{1,2}\1\d{1,2}$/;
//日期正則,復(fù)雜判定
var time = /^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$/;
七.QQ號(hào)以及微信號(hào)
//QQ號(hào)正則,5至11位
var qq = /^[1-9][0-9]{4,10}$/;
//微信號(hào)正則,6至20位,以字母開頭,字母,數(shù)字,減號(hào),下劃線
var wx = /^[a-zA-Z]([-_a-zA-Z0-9]{5,19})+$/;
八.座機(jī)號(hào)
//座機(jī)號(hào)
var tel =/(^0\d{2}-8\d{7}$)|(^0\d{3}-3\d{6}$)/;
附加: 發(fā)送驗(yàn)證碼倒計(jì)時(shí)寫法
<input class="login-code-send" id="login-code-send" type="button" name="sendcode" value="發(fā)送驗(yàn)證碼" onclick="settime(this);"/>
//登錄,忘記密碼的驗(yàn)證碼
var counts = 60;
function settime(val) {
if (counts == 0) {
val.removeAttribute("disabled");
val.value = "獲取驗(yàn)證碼";
counts = 60;
return false;
} else {
val.setAttribute("disabled", true);
val.value = "重新發(fā)送("+counts+")";
counts--;
}
setTimeout(function () {
settime(val);
}, 1000);
}
總結(jié)
以上所述是小編給大家介紹的值得收藏的八個(gè)常用的js正則表達(dá)式,希望對(duì)大家有所幫助,如果大家有任何疑問請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
javascript使用Promise對(duì)象實(shí)現(xiàn)異步編程
這篇文章主要介紹了javascript使用Promise對(duì)象實(shí)現(xiàn)異步編程的相關(guān)資料,需要的朋友可以參考下2016-03-03
Bootstrap Tooltip顯示換行和左對(duì)齊的解決方案
小編在使用Bootstrap的Tooltip功能時(shí)遇到一些小問題,換行丟失,文字不是左對(duì)齊。下面小編給大家介紹下Bootstrap Tooltip顯示換行和左對(duì)齊的解決方案,感興趣的朋友一起看看吧2017-10-10
使用純JS實(shí)現(xiàn)checkbox的框選效果(鼠標(biāo)拖拽多選)
最近做了一個(gè)用js實(shí)現(xiàn)鼠標(biāo)拖拽多選的功能,于是整理了一下思路,寫了一個(gè)小demo,下面這篇文章主要給大家介紹了關(guān)于如何使用純JS實(shí)現(xiàn)checkbox的框選效果(鼠標(biāo)拖拽多選)的相關(guān)資料,需要的朋友可以參考下2022-05-05
JavaScript?Promise多并發(fā)問題的解決方法詳解
提起控制并發(fā),大家應(yīng)該不陌生,這篇文章主要來(lái)和大家介紹一下JavaScript如何解決Promise多并發(fā)問題,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2023-09-09
Nautil 中使用雙向數(shù)據(jù)綁定的實(shí)現(xiàn)
這篇文章主要介紹了Nautil 中使用雙向數(shù)據(jù)綁定的實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-10-10
javascript模擬select,jselect的方法實(shí)現(xiàn)
由于主流瀏覽器對(duì)select元素渲染不同,所以在每種瀏覽器下顯示也不一樣,最主要的是默認(rèn)情況下UI太粗糙,即使通過css加以美化也不能達(dá)到很美觀的效果2012-11-11
JS利用cookie記憶當(dāng)前位置的防刷新導(dǎo)航效果
這篇文章主要介紹了JS利用cookie記憶當(dāng)前位置的防刷新導(dǎo)航效果,涉及JavaScript操作cookie及導(dǎo)航樣式布局的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-10-10

