<input  type="text"   name=''  id="btn">

//发送验证码倒计时
var wait=30;
function time(o) {
if (wait == 0) {
o.removeAttribute("disabled");
o.value="免费获取验证码";
wait = 30;
}else{
o.setAttribute("disabled", true);
o.value="重新发送(" + wait + ")";
wait--;
setTimeout(function() {time(o) },1000)
}

}

document.getElementById("btn").onclick=function(){time(this);}
//调用倒计时JS

jq 写法：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="HTML/js/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">

var InterValObj; //timer变量，控制时间
var count = 5; //间隔函数，1秒执行
var curCount;//当前剩余秒数

function sendMessage() {
  　curCount = count;
　　//设置button效果，开始计时
     $("#btnSendCode").attr("disabled", "true");
     $("#btnSendCode").val("请在" + curCount + "秒内输入验证码");
     InterValObj = window.setInterval(SetRemainTime, 1000); //启动计时器，1秒执行一次
　　  //向后台发送处理数据
     $.ajax({
     　　type: "POST", //用POST方式传输
     　　dataType: "text", //数据格式:JSON
     　　url: 'Login.ashx', //目标地址
    　　 data: "dealType=" + dealType +"&uid=" + uid + "&code=" + code,
    　　 error: function (XMLHttpRequest, textStatus, errorThrown) { },
     　　success: function (msg){ }
     });
}

//timer处理函数
function SetRemainTime() {
            if (curCount == 0) {
                window.clearInterval(InterValObj);//停止计时器
                $("#btnSendCode").removeAttr("disabled");//启用按钮
                $("#btnSendCode").val("重新发送验证码");
            }
            else {
                curCount--;
                $("#btnSendCode").val("请在" + curCount + "秒内输入验证码");
            }
        }
</script>
</head>
<body>
        <input id="btnSendCode" type="button" value="发送验证码" onclick="sendMessage()" /></p>
</body>
</html>

js&jq 发送验证码倒计时的更多相关文章

  1. js实现发送验证码倒计时按钮

    在写注册页面时,有时候需要发送注册邮件来获取验证码,但是为了防止多次重复发送邮件, 必须让按钮隔一段时间后才能再次使用. 代码如下: <html> <head> <met ...

  2. js实现发送验证码倒计时效果

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 原生 JS 实现手机验证码倒计时

    可以使用 pointer-events 来阻止元素成为鼠标事件的 target.html5 新增操作元素 class 类名的方式 classList. classList 方法 add(value): ...

  4. jQuery实现的手机发送验证码倒计时效果代码分享

    这是一款基于jquery实现的手机发送验证码倒计时效果代码,可实现实时显示秒数倒计时的功能,还可实现对手机号码格式验证的功能,是一款常用的网站注册发送手机验证码特效代码. 效果描述:注册一个网站,当需 ...

  5. react native中的聊天气泡以及timer封装成的发送验证码倒计时

    今天看来情书写的文章,研究了一下大佬写的文章,自己做一点总结. 其实,今天我想把我近期遇到的坑都总结一下:1.goBack的跨页面跳转,又两种方法,一可以像兔哥那样修改navigation源码,二可以 ...

  6. js 发送验证码倒计时

    首先写一个按钮: <input type="button" id="btn" value="免费获取验证码" onclick=&quo ...

  7. 手机验证 发送验证码倒计时js

    html: <input name="Tel" class="weui-input" type="tel" placeholder=& ...

  8. jQuery实现发送验证码倒计时60秒

    前端HMTL: <div class="form_box"> <div class="line mb40"> <div class ...

  9. jQuery手机发送验证码倒计时代码

    <!DOCTYPE> <html> <head> <meta charset="UTF-8"> <script type=&q ...

随机推荐

  1. mysql explain 命令讲解

    explian命令可以显示select语句的执行计划 explain的结果中每行对应select语句中的一个表,输出结果中的顺序是按照语句处理表的顺序. mysql使用嵌套循环来处理所有的join连接 ...

  2. [转] MongoDB shell 操作 (查询)

    最近有用到mongoDB,每次都去查看官方文档很是费劲,自己准备写点东西.但在博客园上看到另外的一篇博文不错,就转载过来,加上点儿自己的修饰 左边是mongodb查询语句,右边是sql语句.对照着用, ...

  3. ofbiz进击 第二节。 control 理解与创建

    首先要说的是,学习ofbiz,要去http://ofbiz.apache.org/官网里面,去看右边菜单里   Management Apps  的例子,然后找到类似的页面,去看调用的源码方法. co ...

  4. HDU 4512 吉哥系列故事——完美队形（LCIS）

    Problem Description 吉哥这几天对队形比较感兴趣. 有一天,有n个人按顺序站在他的面前,他们的身高分别是h[1], h[2] ... h[n],吉哥希望从中挑出一些人,让这些人形成一 ...

  5. CCF真题之相反数

    201403-1 问题描述 有 N 个非零且各不相同的整数.请你编一个程序求出它们中有多少对相反数(a 和 -a 为一对相反数). 输入格式 第一行包含一个正整数 N.(1 ≤ N ≤ 500).   ...

  6. 夺命雷公狗---DEDECMS----6快速入门之总结篇

    我们dedecms四大表分别是: dede_channeltype(模型表) dede_arctype(栏目表) dede_archives(文章主表) dede_addonXXXX(附加表) 使用d ...

  7. dota BP练习工具开发：一个C/S多用户程序

    首发:个人博客,更新&纠错&回复 客户端采用C#开发,服务器使用java开发,通信方式为socket. 1.首先决定交互协议 客户端指令协议: getgames:要求服务端发送game ...

  8. ios7下不能录音问题解决

    在ios6上运行非常正常的AVAudioRecoder组件,而跑到ios7上就不能工作了.通过google搜索在stackoverflow上的解决方法.http://stackoverflow.com ...

  9. android 项目学习随笔七（ViewPagerIndicator与ViewPager）

    1.ViewPagerIndicator https://github.com/JakeWharton/ViewPagerIndicator package com.viewpagerindicato ...

  10. iOS从健康app中获取步数信息

    统计步数信息并不需要我们自己去实现,iOS自带的健康app已经为我们统计好了步数数据 我们只要使用HealthKit框架从健康app中获取这个数据信息就可以了 1.如下图所示 在Xcode中打开Hea ...