Regular expression (phone number, mailbox, ID number)

1. Regular expressions?
Used to search, match or replace text in a specific form in the text
2. The format of the expression
/'regular expression string'/gim

Insert picture description here
3. Metacharacters

Metacharacter Features
\d Match a number
\D Match a non-digit
\w Match a number/letter/underscore
\W Match a non-digit/letter/underscore
\s Matches a whitespace
\S Matches a non-whitespace character
. Match any single character except carriage return and line feed

4. Use ^ and $

var reg = /ipad/;//包含ipad
var str = 'apple ipad is cool';
console.log(reg.test(str));
// true 

var reg = /ipad/;//包含ipad
var str = 'apple Ipad is cool';
console.log(reg.test(str));
// false 

var reg = /ipad/ig;//包含ipad,全局匹配,不区分大小写
var str = 'apple Ipad is cool';
console.log(reg.test(str));
// true 

var reg = /^ipad/ig;//以ipad开头,全局匹配,不区分大小写
var str = 'apple Ipad is cool';
console.log(reg.test(str));
// false

var reg = /ipad$/ig;//以ipad结束,全局匹配,不区分大小写
var str = 'apple Ipad is cool';
console.log(reg.test(str));
// false 

var reg = /ipad\$/ig;//包含ipad$,全局匹配,不区分大小写
var str = 'apple Ipad$$$$ is$ cool';
console.log(reg.test(str));
// true

5. Verify the regularity of the mobile phone number
/^1[3|4|5|6|7|8|9]{1}[0-9]{9}/
Analysis:
The characteristics of the mobile phone number: pure numbers, beginning with 1, a total of 11 digits, determine which operator (telecommunications, mobile, China Unicom)
needs: enter the price through the page input box, and click submit to judge the division

<!--html-->
电话号码:<input type="text" id="number" placeholder="请输入您的电话...">
<button onclick="num()">提交</button>
//js
var number=document.getElementById("number");
var reg3=/^1[3|4|5|6|7|8|9]{1}[0-9]{9}/;
var reg4=/^1([33]|[49]|[53]|[73]|[77]|[80]|[89]|[99]){1}[0-9]{8}/;
var reg5=/^1([30]|[31]|[32]|[45]|[55]|[56]|[66]|[71]|[75]|[76]|[85]|[86]){1}[0-9]{8}/;
var reg6=/^1[^1|2]{1}[0-9]{9}/;
function num(){
    
    
	var i=reg3.test(number.value);
	if(i){
    
    
		if(reg4.test(number.value)){
    
    
			alert("是电信号码");
		}else if(reg5.test(number.value)){
    
    
			alert("是联通号码");
		}else if(reg6.test(number.value)){
    
    
			alert("是移动号码");
		}else{
    
    
			alert("啥都不是");
		}
	}else{
    
    
		alert('请输入正确的手机号');
		clear();
	}
}
function clear(){
    
    
	document.getElementById("number").value='';
}

Insert picture description here

6. Mailbox regular
/ ^ [A-Za-z0-9] + ([_ \.] [A-Za-z0-9] +) * @ ([A-Za-z0-9 \ -] + \.) + [A -Za-z] {2,6} $ /

^ [A-Za-z0-9] + ([_ \.] [A-Za-z0-9] +) @ ([A-Za-z0-9 \ -] + \.) [A-Za-z] {2,6}
The beginning is composed of upper and lower letters, numbers -,. Escape character @ Large and small letters, numbers, -, plus. Character end length 2-6 letters
<!--html-->
邮箱:<input type="text" id="number" placeholder="请输入您的邮箱..." onclick="num()">
<span id="span_o" style="display: none;color: lawngreen;">√邮箱符合</span>
<span id='span_n' style="display: none;color: #FF0000;">ⓧ邮箱不正确</span>
//js
<script type="text/javascript">
	var number=document.getElementById("number");
	var span_o=document.getElementById("span_o");
	var span_n=document.getElementById("span_n");
	var demo=/^[A-Za-z0-9]+([_\.][A-Za-z0-9]+)*@([A-Za-z0-9\-]+\.)+[A-Za-z]{2,6}$/;
	function num(){
    
    
		if(demo.test(number.value)){
    
    
			span_o.style.display='block';
		}else{
    
    
			span_n.style.display='block';
		}
	}
</script>

Insert picture description here
7. The regularity of ID card number
/^ [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]$/;

<!--html-->
身份证号:<input type="text" id="number" placeholder="请输入您的身份证号码..." onclick="num()">
<span id="span_o" style="display: none;color: lawngreen;">√符合</span>
<span id='span_n' style="display: none;color: #FF0000;">ⓧ不正确</span>
var number=document.getElementById("number");
var span_o=document.getElementById("span_o");
var span_n=document.getElementById("span_n");
var demo= /^[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]$/;;
function num(){
    
    
	if(demo.test(number.value)){
    
    
		span_o.style.display='block';
	}else{
    
    
		span_n.style.display='block';
	}
}

Insert picture description here

Guess you like

Origin blog.csdn.net/isfor_you/article/details/110425028