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

<!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>

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

相关文章