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

<!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>

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

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

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

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

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

  3. jq实现点击按钮后倒计时，多用于手机验证

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

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

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

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

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

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

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

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

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

  8. 基于jquery鼠标点击图片翻开切换效果

    基于jquery鼠标点击图片翻开切换效果是一款基于jQuery+CSS3实现的点击图片切换特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class=&quo ...

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

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

随机推荐

  1. CUBRID学习笔记 7 ms常见错误

    基本不是权限问题,就是dll问题.  重新下载或应用dll注意版本. 权限的问题,先本机测试. 看看在web管理有无问题.  剩下的基本就简单了 欢迎转载 ,转载时请保留作者信息.本文版权归本人所有, ...

  2. POJ 1142 Smith Numbers（史密斯数）

    Description 题目描述 While skimming his phone directory in 1982, Albert Wilansky, a mathematician of Leh ...

  3. hdu 2196 Computer 树的直径

    Computer Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Problem ...

  4. phpcms 在后台增加了一个模型的话，在数据库中就会相应的增加数据库表

    在phpcms后台管理系统中,我们如果增加一个新的模型的话,例如名为:测试模型,英文名:test 在添加完成后,我们在数据库中发现增加了两个数据表:v9_test,v9_test_data;

  5. JavaScript算法题之–随机数的生成

    JavaScript算法题之–随机数的生成 需求描述:从一组有序的数据中生成一组随机并且不重复的数,类似于简单的抽奖程序的实现. 先来生成一个有序的数组: 1 var arr = [], 2      ...

  6. phpStorm快捷键

    1.快速寻找方法,变量定义处:ctrl + b或者ctrl+单击 2. 移动视图,方便快捷的移动代码窗口: ctrl + up, down 3. 代码方法间快速跳转:alt + up, down

  7. iOS - OC Block 代码块

    前言 Block 是一段预先准备好的代码,可以在需要的时候执行,可以当作参数传递.Block 可以作为函数参数或者函数的返回值,而其本身又可以带输入参数或返回值.Block 是 C 语言的,类似于一个 ...

  8. adb_亮屏

    来自:http://justonlypiano.blogspot.tw/2013/08/adbandroidandroid-phone-screen-off-via.html 更多内容请查看:http ...

  9. 有趣的JavaScript小程序

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

  10. C++——输入、输出和文件

    一.C++输入和输出概述 1.1.流和缓冲区 C++程序把输入和输出看作字节流.输入时,程序从输入流中抽取字节:输出时,程序将字节插入到输出流中.对于面相文本的程序,每个字节代表一个字符,更通俗地说, ...