车牌查询限行系统

JS的车牌限行查询系统

效果如下:
车牌查询限行系统
基于javascript车牌查询系统

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			*{
				margin:0;
				padding:0;
				position:relative;
			}
			/*顶层盒子*/
			#top{
				height:200px;
				/*background-color: #FFA500;*/
				
			}
			/*车牌输入框*/
			#top input{
				border:0;
				outline: 0;
				border-bottom: 2px solid darkslategray;
				position: absolute;
				bottom: 0px;
				right:40%;
				text-align: center;
				height: 40px;
				font-size: 30px;
	
			}
			/*查询按钮*/
			#top #bt1{
				position: absolute;
				bottom: 0px;
				right:36.75%;
				
				text-align: center;
				border: 0;
				outline: 0;
				font-size: 30px;
				
				background-color: coral;				
			}
			/*清除按钮*/
			#top #bt2{
				position: absolute;
				bottom: 0px;
				right:32.75%;
				
				text-align: center;
				border: 0;
				outline: 0;
				font-size: 30px;
				
				background-color: coral;	
			}
			
			/*底层盒子*/
			#buttom{
				height:500px;
				background-color: aqua;
				text-align: center;
				line-height: 100px;
				font-size:30px ;
			}
			
		</style>
	</head>
	<body>
		<div id='top'>
			<!--标题-->
			<h1 style="text-align: center;">车牌查询系统</h1> 
			<!--输入框-->
			<input type="text" name="id1" id="id1" value="" />
			<!--查询按钮-->
			<button id="bt1"  onclick="licenseS()">查询</button>
			<!--清除按钮-->
			<button id="bt2" onclick="deal1()">清除</button>
		</div>
		<div id='buttom'>
			
		</div>
	</body>
</html>
<script type="text/javascript">
	//主函数 (判断是否是车牌号 判断是否限行)
	function licenseS(){
	
		//获取到输入框的数据

		var inputNode = document.getElementById('id1')
		var content1 = inputNode.value
		var content2 = content1 + '输入错误'
		//新建p标签
		var p1Node = document.createElement('p')
		
		var buttomNode = document.getElementById('buttom')
		//调用车牌正则匹配函数
		if (regexMath(content1) == true){
			//调用限行判断函数
			if (trafficControl(content1) == true){
				p1Node.innerText = content1 + '今天限行'
				buttomNode.appendChild(p1Node)
				console.log('正确')
			}
			else{
				p1Node.innerText = content1 + '今日不限行'
				buttomNode.appendChild(p1Node)
			}
			
			
		}
		else{
			p1Node.innerText = content2
			buttomNode.appendChild(p1Node)
		}
		console.log(content1)
		console.log(content2)
		console.log(regexMath(content1))
	}
	
	//车牌正则匹配函数
	function regexMath(content){
			//车牌正则表达式
		var xreg=/^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}(([0-9]{5}[DF]$)|([DF][A-HJ-NP-Z0-9][0-9]{4}$))/;
   		var creg=/^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-HJ-NP-Z0-9]{4}[A-HJ-NP-Z0-9挂学警港澳]{1}$/;
		if(content.length == 7){
			return creg.test(content)
		}
		else if(content.length == 8){
			return xreg.test(content)
		}
		else{
			return false
		}
	
	}
	//限行判断函数
	function trafficControl(content){
		var d2 = new Date()
		str1 = d2.getDay() 
		l1 = content.length
		console.log(l1)
		console.log(str1)
		switch(str1){
			case 1:
					if((content[l1-1] == 1) || (content[l1-1] == 6)){
						return true
					}
					else
					{
						return false
					}
			case 2:
					if((content[l1-1] == 2) || (content[l1-1] == 7)){
						return true
					}
					else
					{
						return false
					}
			
			case 3:
					if((content[l1-1] == 3) || (content[l1-1] == 8)){
						return true
					}
					else
					{
						return false
					}
			
			case 4:
					if((content[l1-1] == 4) || (content[l1-1] == 9)){
						return true
					}
					else
					{
						return false
					}
			
			case 5:
					if((content[l1-1] == 5) || (content[l1-1] == 0)){
						return true
					}
					else
					{
						return false
					}
			default:{
				return true
			}
		}
	}
	// 清除函数
	function deal1(){
		var buttomNode = document.getElementById('buttom')
		buttomNode.removeChild(buttomNode.firstChild)
	}
</script>