您的位置:首页 > Web前端 > JQuery

jquery 发送短信60后重新获取

2013-08-20 11:54 274 查看
先需要form表单,获取短信的按钮做成两个相同的,一个显示,一个隐藏。

<div class="item">
<p class="item_p">
<label>手机号:</label>
<input class="text js_name" type="text" name="moblie" value=""/>
<span class="prompt_msg prompt">用于登录和找回密码,不会公开</span>
</p>
<a id="old_display" class="L_get_code" href="javascript:;">免费获取短信验证码</a>
<a class="L_get_code" id="display_none" style="display:none;" href="javascript:;">免费获取短信验证码</a>
</div>

js文件:

$('#old_display').bind('click',function(){
var js_name=$(".js_name").val();
if(js_name){        var that=$(this);
var tick=null;
var time=60;
if(tick==null){
tick=setInterval(function(){
if(time>0){
$("#display_none").show();   //如果在时间大于0,第二个隐藏的显示出来,并更改文字,则第一个隐藏
$("#old_display").hide();
$("#display_none").text('重新获取('+time+')');
time--;
}else{
$("#old_display").show();   //如果时于小于0了,但恢复原来的样子,清除时间
$("#display_none").hide();
clearInterval(tick);
}
},1000);

$.ajax({
type:"POST",
url:getRootPath()+'/register_login/send_mobile_code',
dataType:"json",
data:"mobile="+js_name,
success:function(msg){
if(msg){
$(this).parent().append("<span>已发送,1分钟后可重新获取</span>");
}
}

})
}else{
alert('不可为空');
}

}else{
return false;
}
})
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: