手机号码注册带正则验证和发验证码倒计时

<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title></title>
		<style type="text/css">
			#btn {
				width: 150px;
				height: 40px;
				background: green;
				font-size: 17px;
			}
		</style>
		<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
		<script type="text/javascript">
			$(function() {
				$('#btn').click(function() {
					var reg = /^1\d{10}$/;
					if ($('#num').val() == "") {
						alert('请输入电话好吗?');
					} else if (!reg.test($('#num').val())) {
						alert('请输入正确的电话好吗?');
					} else {
						$(this).css('background', 'blue').css('color', 'red');
						var i = 5;
						var n = setInterval(function() {
							var j = i + 's';
							$('#btn').val(j);
							i--;
							if (i < -1) {
								clearInterval(n);
								$('#btn').val('重新获取验证码!');
							}
						}, 1000);
					}
				});
			})
		</script>
	</head>

	<body>
		<input type="text" autofocus="autofocus" id="num" />
		<input type="button" value="获取验证码" id="btn" />
	</body>

</html>
手机号码注册带正则验证和发验证码倒计时_第1张图片

你可能感兴趣的:(手机号码注册带正则验证和发验证码倒计时)