javascript中使用正則表達(dá)式進(jìn)行字符串驗(yàn)證示例
更新時(shí)間:2013年05月10日 15:23:10 作者:
我寫(xiě)的一個(gè)表達(dá)式驗(yàn)證示例:功能如下:用戶名,不能為空;密碼6為數(shù)字;密碼確認(rèn),兩次輸入密碼必須相同;身份證號(hào)碼必須是15位,或者是18位,最末尾也可以是X
var reg=/正則表達(dá)式/;
boolean reg.test(要驗(yàn)證的字符串);
js引擎會(huì)將/正則表達(dá)式/“”轉(zhuǎn)換成一個(gè)RegExp對(duì)象,當(dāng)字符串滿足正則表達(dá)式的要求事,返回true。
我寫(xiě)的一個(gè)表達(dá)式驗(yàn)證示例:功能如下:
用戶名,不能為空
密碼6為數(shù)字
密碼確認(rèn),兩次輸入密碼必須相同
身份證號(hào)碼必須是15位,或者是18位,最末尾也可以是X(該功能還沒(méi)有寫(xiě),有時(shí)間再補(bǔ)上)
<!DOCTYPE html>
<html>
<head>
<title>testTablel.html</title>
<!-- 用戶名,不能為空
密碼6為數(shù)字
密碼確認(rèn),兩次輸入密碼必須相同
身份證號(hào)碼必須是15位,或者是18位,最末尾也可以是X -->
<style>
#d1 {
width: 400px;
height: 250px;
background-color: #FFE4B5;
margin: 40px auto;
}
#d1_head {
color: white;
font-size: 20px;
font-family: "Arial";
height: 24px;
background-color: bule;
}
#d1_content {
padding-left: 30px;
padding-top: 30px;
}
.s1 {
color: red;
font-style: italic;
}
.s2 {
border: 2px dotted blue;
}
</style>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script>
function check_username(){
var txtObj=document.getElementById("username");
txtObj.className='';
var msgObj=docuemnt.getElementById("username_msg");
msgObj.innerHTML='';
if(txtObj.value.length==0){
msgObj.innerHTML='用戶名不能為空';
//給節(jié)點(diǎn)的class屬性賦值
txtObj.className='s2';
return false;
}
return true;
}
function check_pwd(){
var pwdObj=document.getElementById("pwd");
pwdObj.classNames='';
var msgObj=document.getElementById("pwd_msg");
msgObj.innerHTML='';
var reg=/^\d{6}$/;
//javascript中一個(gè)test方法,返回boolean
if(!reg.test(pwdObj.value)){
msgObj.innerHTML='密碼是6位數(shù)';
pwdObj.className='s2';
return false;
}
return true;
}
function check_pwd1(){
var pwdObj=document.getElementById("pwd");
// pwdObj.classNames='';
// var msgObj=document.getElementById("pwd_msg");
// msgObj.innerHTML='';
var pwdObj1=document.getElementById("pwd1");
//pwdObj1.classNames='';
var msgObj1=document.getElementById("pwd_msg1");
msgObj1.innerHTML='';
if(pwdObj.value!=pwdObj1.value){
msgObj1.innerHTML='密碼不一致,請(qǐng)重新輸入';
return false;
}
return true;
}
function check_form(){
var flag=check_username()&&check_pwd()&&check_pwd1;
return flag;
}
</script>
</head>
<body>
<div id="d1">
<div id="d1_head">注冊(cè)</div>
<div id="d1_content">
<form onsubmit="return check_form();">
<table>
<tr>
<td>用戶名</td>
<td><input id="username" name="username"
onblur="check_username();" /> <span class="s1" id="username_msg"></span>
</td>
</tr>
<tr>
<td>密碼</td>
<td><input type="password" id="pwd" name="pwd"
onblur="check_pwd();" /> <span class="s1" id="pwd_msg"></span></td>
</tr>
<tr>
<td>確認(rèn)密碼</td>
<td><input type="password" id="pwd1" name="pwd1"
onblur="check_pwd1();" /> <span class="s1" id="pwd_msg1"></span>
<tr>
<td colspan="2">
<input type="submit" value="確認(rèn)" /> <input type="reset"
value="重置" />
</td>
</tr></table>
</form>
</div>
</div>
</body>
</html>
boolean reg.test(要驗(yàn)證的字符串);
js引擎會(huì)將/正則表達(dá)式/“”轉(zhuǎn)換成一個(gè)RegExp對(duì)象,當(dāng)字符串滿足正則表達(dá)式的要求事,返回true。
我寫(xiě)的一個(gè)表達(dá)式驗(yàn)證示例:功能如下:
用戶名,不能為空
密碼6為數(shù)字
密碼確認(rèn),兩次輸入密碼必須相同
身份證號(hào)碼必須是15位,或者是18位,最末尾也可以是X(該功能還沒(méi)有寫(xiě),有時(shí)間再補(bǔ)上)
復(fù)制代碼 代碼如下:
<!DOCTYPE html>
<html>
<head>
<title>testTablel.html</title>
<!-- 用戶名,不能為空
密碼6為數(shù)字
密碼確認(rèn),兩次輸入密碼必須相同
身份證號(hào)碼必須是15位,或者是18位,最末尾也可以是X -->
<style>
#d1 {
width: 400px;
height: 250px;
background-color: #FFE4B5;
margin: 40px auto;
}
#d1_head {
color: white;
font-size: 20px;
font-family: "Arial";
height: 24px;
background-color: bule;
}
#d1_content {
padding-left: 30px;
padding-top: 30px;
}
.s1 {
color: red;
font-style: italic;
}
.s2 {
border: 2px dotted blue;
}
</style>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script>
function check_username(){
var txtObj=document.getElementById("username");
txtObj.className='';
var msgObj=docuemnt.getElementById("username_msg");
msgObj.innerHTML='';
if(txtObj.value.length==0){
msgObj.innerHTML='用戶名不能為空';
//給節(jié)點(diǎn)的class屬性賦值
txtObj.className='s2';
return false;
}
return true;
}
function check_pwd(){
var pwdObj=document.getElementById("pwd");
pwdObj.classNames='';
var msgObj=document.getElementById("pwd_msg");
msgObj.innerHTML='';
var reg=/^\d{6}$/;
//javascript中一個(gè)test方法,返回boolean
if(!reg.test(pwdObj.value)){
msgObj.innerHTML='密碼是6位數(shù)';
pwdObj.className='s2';
return false;
}
return true;
}
function check_pwd1(){
var pwdObj=document.getElementById("pwd");
// pwdObj.classNames='';
// var msgObj=document.getElementById("pwd_msg");
// msgObj.innerHTML='';
var pwdObj1=document.getElementById("pwd1");
//pwdObj1.classNames='';
var msgObj1=document.getElementById("pwd_msg1");
msgObj1.innerHTML='';
if(pwdObj.value!=pwdObj1.value){
msgObj1.innerHTML='密碼不一致,請(qǐng)重新輸入';
return false;
}
return true;
}
function check_form(){
var flag=check_username()&&check_pwd()&&check_pwd1;
return flag;
}
</script>
</head>
<body>
<div id="d1">
<div id="d1_head">注冊(cè)</div>
<div id="d1_content">
<form onsubmit="return check_form();">
<table>
<tr>
<td>用戶名</td>
<td><input id="username" name="username"
onblur="check_username();" /> <span class="s1" id="username_msg"></span>
</td>
</tr>
<tr>
<td>密碼</td>
<td><input type="password" id="pwd" name="pwd"
onblur="check_pwd();" /> <span class="s1" id="pwd_msg"></span></td>
</tr>
<tr>
<td>確認(rèn)密碼</td>
<td><input type="password" id="pwd1" name="pwd1"
onblur="check_pwd1();" /> <span class="s1" id="pwd_msg1"></span>
<tr>
<td colspan="2">
<input type="submit" value="確認(rèn)" /> <input type="reset"
value="重置" />
</td>
</tr></table>
</form>
</div>
</div>
</body>
</html>
相關(guān)文章
JS點(diǎn)擊圖片改變圖片圖徑并用正則表達(dá)式取圖片名的代碼
JS點(diǎn)擊圖片改變圖片圖徑并用正則表達(dá)式取圖片名,非常不錯(cuò)的效果。2010-06-06計(jì)算一個(gè)字符串在另一字符串中出現(xiàn)的次數(shù)函數(shù)
計(jì)算一個(gè)字符串在另一字符串中出現(xiàn)的次數(shù)函數(shù)2008-03-03正則表達(dá)式應(yīng)用之提煉百度歌詞的實(shí)現(xiàn)代碼
前幾天看了下百度音樂(lè)盒的功能,發(fā)現(xiàn)有歌詞功能,用正則匹配了下,需要的朋友可以參考下。2011-06-06js正則表達(dá)式之RegExp對(duì)象屬性lastIndex,lastMatch,lastParen,lastContext,
js正則表達(dá)式之RegExp對(duì)象屬性lastIndex,lastMatch($&),lastParen($+),lastContext,rightContext屬性的講解2012-10-10js正則表達(dá)式驗(yàn)證URL函數(shù)代碼(方便多個(gè)正則對(duì)比)
下面是一段相對(duì)全面的用例測(cè)試,可以考慮使用,當(dāng)然,如果你的要求很簡(jiǎn)單,用網(wǎng)上傳的各種簡(jiǎn)單版,cover到自己的用例就好。2016-10-10webregexp 正則測(cè)試實(shí)現(xiàn)代碼
WebRegExp 1.0 - 客服果果 [ 無(wú)憂版 ]對(duì)于想學(xué)習(xí)正則的朋友是個(gè)不錯(cuò)的在線工具,測(cè)試你正則的正確性。2009-03-03