<!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="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>

</head>
<body>

   <input id="mobile" type="text" value="" />
        <input id="sendMess" type="button" value="发送验证码" /></p>
</body>
</html>

<script type="text/javascript">

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

$(function(){

$("#sendMess").click ( function () {
        var mobile=$("#mobile").val();
        if(""!=$.trim(mobile)){
            curCount = count;
            $("#sendMess").attr("disabled","true");
            $("#sendMess").val("请在" + curCount + "秒内输入验证码");
             InterValObj = window.setInterval(SetRemainTime, 1000); //启动计时器,1秒执行一次
           /*   $.ajax({
                type: "POST",
                url: "/Test/sendMess",
                data:{mobile:mobile},
                success: function(mess) {
                  alert(mess);
                }
            });*/
        }else{
            alert("请输入手机号!")
        }

});

});

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

jquery实现获取手机验证码倒计时效果的更多相关文章

  1. js获取手机验证码倒计时的实现

    方案一 <div class="div user-input"> <input type="number" class="code& ...

  2. 【jQuery】手机验证码倒计时效果

    <ul class="ulist"> <li class="group"> <label class="label&qu ...

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

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

  4. Andorid实现点击获取验证码倒计时效果

    这篇文章主要介绍了Andorid实现点击获取验证码倒计时效果,这种效果大家经常遇到,想知道如何实现的,请阅读本文   我们在开发中经常用到倒计时的功能,比如发送验证码后,倒计时60s再进行验证码的获取 ...

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

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

  6. vue 项目,获取手机验证码和图形验证码(iviewUI框架)

    1.编辑获取验证码模块 <Form ref="phoneFormItem" :model="phoneFormItem" :label-width=&qu ...

  7. 微信小程序获取手机验证码

    一种比较常见的功能获取手机验证码 先看效果图: 其实这个功能实现起来很简单,主要就是调取第三方接口,拿到返回值验证的问题 直接上代码吧: wxml页面: <view class='changeI ...

  8. C#获取手机验证码+榛子云平台

    今天给大家推荐一个简单的获取手机验证码注册+获取随机4位数 测试框架:.net4.7以上 1.榛子云注册:http://smsow.zhenzikj.com/,送一条测试短信,最低充10元即刻使用 2 ...

  9. Android Studio使用Mob来获取手机验证码加上倒计时

    再根据上编的基础上再添加倒计时即可 添加一个类TimeCountUtil package zhu.com.yzm4; import android.os.CountDownTimer; import ...

随机推荐

  1. Java Socket编程(转)

    Java Socket编程 对于Java Socket编程而言,有两个概念,一个是ServerSocket,一个是Socket.服务端和客户端之间通过Socket建立连接,之后它们就可以进行通信了.首 ...

  2. windows 2003 企业版 下载地址+序列号

    迅雷地址: thunder://QUFodHRwOi8vcy5zYWZlNS5jb20vV2luZG93c1NlcnZlcjIwMDNTUDJFbnRlcnByaXNlRWRpdGlvbi5pc29a ...

  3. filter应用案例三:解决全站编码问题

    1 说明 乱码问题: 获取请求参数中的乱码问题: POST请求:request.setCharacterEncoding("utf-8"): GET请求:new String(re ...

  4. lr_save_string 和 sprintf 的使用

    lr_save_string 和 sprintf 的使用 一.lr_save_string 使用介绍1.该函数主要是将程序中的常量或变量保存为lr中的参数.格式: //将常量保存为参数 lr_save ...

  5. Maven项目在Eclipse中调试 Debug

    废话不说一路跟图走. 断点会进入到如下页面点击Edit Source Lookup Path 如下图操作 成功进入Debug模式

  6. caffe配置python环境

    make pycaffe 在python中import caffe

  7. DSP using MATLAB 示例 Example3.13

    上代码: w = [0:1:500]*pi/500; % freqency between 0 and +pi, [0,pi] axis divided into 501 points. H = ex ...

  8. psql-03数据类型(1)

    PostgreSQL支持的数据类型远比其他数据库要多; 类型输入与转换 select int '1', date '2015-12-6'; select '1'::int, '2015-12-6':: ...

  9. .net平台下C#socket通信(中)

    上篇.net平台下C#socket通信(上)介绍了socket通信的基本原理及最基本的通信方式.本文在此基础上就socket通信时经常遇到的问题做一个简单总结,都是项目中的一些小问题,拿来此处便于下次 ...

  10. iOS学习02C语言分支结构

    1. BOOL类型 返回值:真:YES  假:NO BOOL数据类型占一个字节的内存空间,占位符为%d. 计算机在识别时,YES就替换成1,NO就替换成0. bool是C语言中的布尔类型,返回值为tr ...