jQuery实现发送验证码倒计时60秒
前端HMTL:
<div class="form_box">
<div class="line mb40">
<div class="item">手机验证码:</div>
<div class="cont">
<!--点击发送验证码后,倒计时class="count" style="block" -->
<p class="code">
<input type="text" value="" class="input_text">
<span class="info">
<em style="display: none" class="count">(60)秒后重新发送</em>
<a href="javascript:;" class="send" onclick="sendValidCode();">发送验证码</a>
</span>
</p>
</div>
</div>
<!--消息提示区域 -->
<div style="visibility: hidden; margin-left: 192px; height: 30px;" id="errorNotice">
</div>
<!--设置页面-->
<div class="line">
<div class="item"></div>
<div class="cont">
<input type="button" onclick="checkValidCode();" value="确 定" class="button01">
</div>
</div>
</div>
jQuery实现60秒倒计时:
//发送验证码
function sendValidCode(){
$('#errorNotice').html('');
$('.input_text').val(''); $.ajax({
type: 'post',
dataType: "json",
url: "/Ajax/PhoneAuthen.php",
data: {
ajaxMethod: "sendValidCodeNew",
mtype: "2"
},
success: function(data){
if (data.result > 0) { }
else {
$('#errorNotice').html('短信发送失败,请稍后重试!');
$('#errorNotice').css('visibility', 'visible');
}
},
error: function(data){
$('#errorNotice').html('短信发送失败,请稍后重试!');
$('#errorNotice').css('visibility', 'visible');
}
}); //60秒后重新发送
var btnSend = $(".send");
var msg = $('.count');
btnSend.removeAttr('style').attr('style', 'display:none;');
msg.removeAttr('style').attr('style', 'display:block');
var left_time = 60;
var tt = window.setInterval(function(){
left_time = left_time - 1;
if (left_time <= 0) {
window.clearInterval(tt);
msg.html('(60)秒后重新发送');
msg.removeAttr('style').attr('style', 'display:none;');
btnSend.removeAttr('style').attr('style', 'display:block');
}
else {
msg.html('(' + left_time + ')秒后重新发送');
}
}, 1000);
}
备注:
visibility:hidden/visible 设置为隐藏/显示(始终占位)
display:不占位
jQuery实现发送验证码倒计时60秒的更多相关文章
- js 验证码 倒计时60秒
js 验证码 倒计时60秒 <input type="button" id="btn" value="免费获取验证码" /> & ...
- vue实现验证码倒计时60秒的具体代码
vue实现验证码倒计时60秒的具体代码 <span v-show="show" @click="getCode">获取验证码</span> ...
- jQuery手机发送验证码倒计时代码
<!DOCTYPE> <html> <head> <meta charset="UTF-8"> <script type=&q ...
- javaScript 验证码 倒计时60秒
<input type="button" id="btn" value="免费获取验证码" /> <script type ...
- iOS-登录发送验证码时60秒倒计时,直接用
__block NSInteger timeout= ; //倒计时时间 KWeakSelf dispatch_queue_t queue = dispatch_get_global_queue(DI ...
- jQuery实现的手机发送验证码倒计时效果代码分享
这是一款基于jquery实现的手机发送验证码倒计时效果代码,可实现实时显示秒数倒计时的功能,还可实现对手机号码格式验证的功能,是一款常用的网站注册发送手机验证码特效代码. 效果描述:注册一个网站,当需 ...
- jQuery实现发送短信验证码后60秒倒计时
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script sr ...
- Jquery插件实现点击获取验证码后60秒内禁止重新获取
通过jquery.cookie.js插件可以快速实现“点击获取验证码后60秒内禁止重新获取(防刷新)”的功能 先到官网(http://plugins.jquery.com/cookie/ )下载coo ...
- js实现倒计时60秒的简单代码
<!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Conten ...
随机推荐
- [three.js] 地图不能解决重复的问题 Solving with Texture RepeatWrapping Fail Issue
有些事情,如果你正在寻找侯,怎么也找不到. 有的东西,不经意间,到处: 我认为这是生活中常有的事. 然而,在互联网的浩瀚大海,这同样适用. 正常的一小会儿的积累, 投入少, 积累, 洋大海, 载起一帆 ...
- maple 教程
1 初识计算机代数系统Maple 1.1 Maple简说 1980年9月, 加拿大Waterloo大学的符号计算机研究小组成立, 開始了符号计算在计算机上实现的研究项目, 数学软件Maple是这个项目 ...
- 《TCP/IP作品详细解释2:达到》注意事项--ARP:地址解析协议
Net/3于ARP和实施密切与路由表相关联的,下图显示了我们的叙述性说明ARP使用样品. watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvVE9ERDkxMQ ...
- 数据库管理——Powershell——使用Powershell脚本找出消耗最多磁盘空间的文件
原文:数据库管理--Powershell--使用Powershell脚本找出消耗最多磁盘空间的文件 原文译自: http://www.mssqltips.com/sqlservertip/2774/p ...
- D3D 扎带 小样本
D3D 符合基本程序 #pragma once #pragma comment(lib,"d3d9.lib") #pragma comment(lib,"d3dx9.li ...
- 家庭洗车APP --- Androidclient开展 之 网络框架包介绍(一)
家庭洗车APP --- Android客户端开发 之 网络框架包介绍(一) 上篇文章中给大家简单介绍了一些业务.上门洗车APP --- Android客户端开发 前言及业务简单介绍,本篇文章给大家介绍 ...
- android 该项目的优化toast优化技巧
我们这样做的时候经常登录认证使用toast提示用户输入出现错误等..很多人都直接使用 Toast.makeText(LoginActivity.this, "请联系小区的物业管理" ...
- POJ 1631 Bridging signals(LIS 二分法 高速方法)
Language: Default Bridging signals Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 1076 ...
- UVa - The 3n + 1 problem 解读
这个问题并计算质数了一下相间隔似的.思想上一致. 注意问题: 1 i 可能 大于或等于j -- 这里上传.小心阅读题意,我没有说这个地方不能保证.需要特殊处理 2 计算过程中可能溢出,的整数大于最大值 ...
- arcgis,mapinfo(mapxtreme),openlayers专业GIS系统开发
专业从事基于C#,WinForm ,WPF,Silverlight,WCF以及MS Sql Server 2000/2005/2008/2012 Oracle 9i/10g/11g数据库系统的ERP, ...