js60倒计时

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>60s倒计时(使用jq)</title>
	</head>
	<body>
         <span id="countDownText" style="display: none;">60重新获取</span>
		<span  id="timeBtn">获取验证码</span>
	</body>
	<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
	<script type="text/javascript">
		//发送验证码
		$("#timeBtn").click(function() {
			$("#timeBtn").hide();
			$("#countDownText").show();
			var countDown = 60;
			var setTime = setInterval(function() {
				if(countDown <= 0) {
					clearInterval(setTime);
					$("#countDownText").text('获取验证码');
					$("#countDownText").hide();
			        $("#timeBtn").show();
				} else {
					countDown--;
					$("#countDownText").text(countDown+"重新获取");
				}
			}, 1000);
		})
	</script>
</html>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>60s倒计时(js)</title>
	</head>
	<body>
      <input type="button" value="获取验证码" onclick="code(this)" />
	</body>
	<script type="text/javascript">
	   var time = 6;
		function code(obj) {
			if(time == 0) {
				obj.removeAttribute('disabled', false);
				obj.value='获取验证码';
				time = 6;
				return;
			} else {
				obj.setAttribute('disabled', true);
				obj.value="从新获取(" + time + "s)";
				time--;
			}
			setTimeout(function() {
				code(obj);
			}, 1000)
		}
	</script>
</html>

//设置属性
// setAttribute：
// 1：给某个元素设置属性，两个参数（属性名，属性值）
// removeAttribute
// 1：通过属性名删除某一元素属性，一个参数（属性名）

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>60s倒计时（使用jq）</title>
	</head>
	<body>
      <input type="button" value="获取验证码" onclick="code(this)" />
	</body>
	<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
	<script type="text/javascript">
	var time = 6;
		function code(obj) {
			var obj = $(obj);
			if(time == 0) {
				obj.attr('disabled', false);
				obj.val('获取验证码');
				time = 6;
				return;
			} else {
				obj.attr('disabled', true);
				obj.val("从新获取(" + time + "s)");
				time--;
			}
			setTimeout(function() {
				code(obj);
			}, 1000)
		}
	</script>
</html>

猜你喜欢