发送验证60秒
<!doctype html>
<head>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
var InterValObj; //timer变量，控制时间
var count = 60; //间隔函数，1秒执行
var curCount;//当前剩余秒数
function getMsgCode(){
curCount = count ;
if($('#phone').val() == ''){
$("#buyerphone").html('<img src="${ctxStatic}/website/images/tanhao.jpg" width="14" height="14" alt=""/>电话不能为空！！');
$("#buyerphone").css("display","inline");
return false;
}
//发送验证码请求
$.ajax({
type: 'get',
url: '${ctx}/sendMsgValidCode',
data:{'mobile':$('#phone').val()},
success: function(data) {
if(data=='success'){
alert("验证码已发送！");
$(".fasong").attr("disabled", "true");
$(".fasong").val(curCount + "秒后重新发送");
InterValObj = window.setInterval(SetRemainTime, 1000); //启动计时器，1秒执行一次
}else{
alert("验证码发送失败！");
}
}
});
}
//timer处理函数
function SetRemainTime() {
if (curCount == 0) {
window.clearInterval(InterValObj);//停止计时器
$(".fasong").removeAttr("disabled");//启用按钮
$(".fasong").val("重新发送验证码");
}
else {
curCount--;
$(".fasong").val( curCount + "秒后重新发送");
}
}
</script> </head> <body> <input id="btnSendCode" type="button" value="发送验证码" onclick="sendMessage()" /></p> </body> </html>
不带ajax
<!DOCTYPE html>
<html>
<head>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
var countdown=60;
function settime(obj) {
if (countdown == 0) {
obj.removeAttribute("disabled");
obj.value="免费获取验证码";
countdown = 60;
return;
} else {
obj.setAttribute("disabled", true);
obj.value="重新发送(" + countdown + ")";
countdown--;
}
setTimeout(function() {
settime(obj) }
,1000)
}
</script>
<body>
<input type="button" id="btn" value="免费获取验证码" onclick="settime(this)" />
</body>
</html>
