<!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 = 30; //间隔函数，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: "json", //数据格式: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>

jquery 实现点击按钮后出现倒计时效果（用于实现发送手机验证码、邮箱验证码）的更多相关文章

  1. jquery 实现 点击按钮后倒计时效果，多用于实现发送手机验证码、邮箱验证码

    原文链接:http://www.cnblogs.com/steed-zgf/archive/2012/02/03/2336984.html <!DOCTYPE html PUBLIC " ...

  2. js jquery 实现点击按钮后,倒计时60秒才能再次点击发送验证邮件

    <input type="button" id="btn" value="免费获取验证码" /><script type= ...

  3. response 后刷新页面,点击按钮后，禁用该按钮

    一,正常的点击按钮后,将其灰显,全部执行完毕再正常显示. this.btnSave.Attributes.Add("onclick", "if (typeof(Page_ ...

  4. TProcedure，TMethod，TNotifyEvent，TWndMethod的区别，并模拟点击按钮后发生的动作

    忽然发现TProcedure和TNotifEvent的区别还挺大的: procedure TForm1.Button2Click(Sender: TObject); begin ShowMessage ...

  5. JQuery实现点击按钮切换图片(附源码)--JQuery基础

    JQuery实现切换图片相对比较简单,直接贴代码了哈,有注释噢!疑问请追加评论哈,不足之处还请大佬们指出! 1.案例代码: demo.html: <!DOCTYPE html><ht ...

  6. Java基础 awt Button 点击按钮后在控制台输出文字

        JDK :OpenJDK-11      OS :CentOS 7.6.1810      IDE :Eclipse 2019‑03 typesetting :Markdown   code ...

  7. jquery实现点击按钮弹出层和点击空白处隐藏层

    昨天做项目遇到一个问题,和大家分享下,jquery实现点击按钮弹出层和点击空白处隐藏层的问题 if($('.autoBtn').length){                $('.autoBtn' ...

  8. 如何让Web程序在点击按钮后出现如执行批处理程序般的效果

    在cli程序中,输入命令得到连续的输出已经是一种进度而美观的页面交互形式,好比下图: 而web程序里也有类似的场景,比如执行一个耗时任务,除了显示出等待图标外,用户还希望把执行的状态及时显示出来.如下 ...

  9. 基于jQuery鼠标点击弹出登陆框效果

    基于jQuery鼠标点击弹出登陆框效果.这是一款扁平样式风格的jQuery弹出层登陆框特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <input type=" ...

随机推荐

  1. selenium测试（Java）--元素操作（五）

    元素的操作有 1. 清除文本 2. 模拟按键输入 3. 单击元素 4. 返回元素尺寸 5. 获取文本 6. 获取属性值 7. 判断是否可见 8. 提交 下面通过操作新浪邮箱的注册界面的脚本来展示使用方 ...

  2. imx6 android power off

    调试android4.2的关机功能,希望再按下power按键长时间之后就关机.不弹出选框. 参考链接 http://www.cnblogs.com/sardine/archive/2011/07/26 ...

  3. 10个最佳的触控手式的JavaScript框架（转）

    由于各种原因移动开发是一项艰难的工作,比如它是非常耗时的.充满压力的任务.最重要的是,作为一个开发人员,你必须保持更新所有最新 的技术和技巧——你必须知道所有最新的趋势,问题和解决方案等.例如跨浏览器 ...

  4. 从头认识java-18.2 主要的线程机制（7）join

    这一章节我们来讨论一下join. 1.什么是join? 阻塞当前线程,让.join的线程先做完.然后再继续当前线程 以下是api的解释: A.join,在API中的解释是,阻塞当前线程B,直到A运行完 ...

  5. c++ list erase()

    STL中的容器按存储方式分为两类,一类是按以数组形式存储的容器(如:vector .deque):另一类是以不连续的节点形式存储的容器(如:list.set.map).在使用erase方法来删除元素时 ...

  6. Hbase1.1.0.1配置集群

    参考链接 http://wuyudong.com/archives/119?utm_source=tuicool 参考链接 http://www.cnblogs.com/archimedes/p/45 ...

  7. AI逻辑实现-取舍行为树还是状态机

    AI逻辑实现-选择行为树还是状态机? 关注AI的朋友可能会看过赖勇浩翻译的<有限状态机时代终结的10大理由> ,里面谈到了状态机的诸多弊端.同时在ppt(附上下载地址)中述说了行为树的诸多 ...

  8. 如何用ChemDraw建立多中心结构

    通过调整ChemDraw多中心机构的连接可绘制有意义的络合物结构,建立中心原子和络合配体后,利用多中心化学键连接上述结构即可.以下内容将具体介绍如何用ChemDraw建立多中心结构. 一.多中心键和多 ...

  9. vuex的简单使用

    使用vuex进行组件间数据的管理 npm i vuex -S main.js import Vue from 'vue' import App from './App.vue' import stor ...

  10. swift开发之--UISearchBar的使用/UISearchController的使用

    记录下UISearchBar的基本用法,补充:ios 8.0以后,原来的UISearchDisplayController被官方废弃,建议使用UISearchController,下面就简单的记录下这 ...