知识 分享 互助 快乐十分玩法与奖金

    懒人建站专注于网页素材下载,提供网站模板、网页设计、ps素材、图片素材等,服务于【个人站长】【网页设计师】和【web开发从业者】的代码素材与设计素材网站。

    懒人建站提供网页素材下载、网站模板
    知识 分享 互助!

    陕西快乐十分走势图表:jquery倒计时按钮常用于验证码倒计时按钮

    作者:佳明妈 来源:郑州网站建设 2016-12-24 人气:
    jquery倒计时按钮代码,常用于验证码倒计时按钮,代码效果就是点击按钮以后按钮上面会出现倒计时读数,倒计时的时间可以自行指定,按钮倒计时的格式有4中格式可选。

    快乐十分玩法与奖金 www.j63d3.cn jquery倒计时按钮代码,常用于验证码倒计时按钮,代码效果就是点击按钮以后按钮上面会出现倒计时读数,倒计时的时间可以自行指定,按钮倒计时的格式有4中格式可选。倒计时代码依赖jquery,因为里面有些节点操作是直接用的jq方法,注册自定义事件也是用的jq方法,jquery确实是个非常棒的js库。

    倒计时代码调用方法:

    <h3>使用演示 显示为 秒</h3>
    <p style="margin-bottom: 40px;">
        <button type="button" id="test1">获取验证码</button>
        <button type="button" id="test1-clear">清理验证码</button>
    </p>
    <h3>使用演示 显示为 分:秒</h3>
    <p style="margin-bottom: 40px;">
        <button type="button" id="test2">获取验证码</button>
    </p>
    <h3>使用演示 显示为 天:时:分:秒</h3>
    <p style="margin-bottom: 40px;">
        <button type="button" id="test3">获取验证码</button>
    </p>
    <h3>使用演示 显示为 天:时:分:秒</h3>
    <p style="margin-bottom: 40px;">
        <button type="button" id="test4">获取验证码</button>
    </p>
    

    倒计时显示为 秒

    //使用演示 显示为 秒
    $("#test1").on("click",function(){
        buttonCountdown($(this), 1000 * 60 * 3, "ss");
    }); 

    倒计时显示为 分:秒

    //使用演示 显示为 分:秒
    $("#test2").on("click",function(){
        buttonCountdown($(this), 1000 * 60 * 3, "m:s");
    });
    

    使倒计时显示为 时:分:秒

    //使用演示 显示为 时:分:秒
    $("#test3").on("click",function(){
        buttonCountdown($(this), 1000 * 60 * 3, "h:m:s");
    }); 

    倒计时显示为 天:时:分:秒

    //使用演示 显示为 天:时:分:秒
    $("#test4").on("click",function(){
        buttonCountdown($(this), 1000 * 60 * 3, "d:h:m:s");
    });
    

    清理$("#test1")的倒计时 比如请求出错或者什么原因要清理倒计时按钮

    //清理$("#test1")的倒计时  比如请求出错或者什么原因要清理倒计时按钮
    $("#test1-clear").on("click",function(){
        $("#test1").trigger("bc.clear");
    });
    

    jquery倒计时按钮常用语验证码倒计时按钮

    倒计时代码函数

    //快乐十分玩法与奖金,服务于【个人站长】【网页设计师】和【web开发从业者】的代码素材与设计素材网站。
    //懒人建站//www.j63d3.cn/
    //jquery倒计时按钮常用于验证码倒计
    function buttonCountdown($el, msNum, timeFormat) {
        var text = $el.data("text") || $el.text(),
                timer = 0;
        $el.prop("disabled", true).addClass("disabled")
                .on("bc.clear", function () {
                    clearTime();
                });
    
        (function countdown() {
            var time = showTime(msNum)[timeFormat];
            $el.text(time + '后失效');
            if (msNum <= 0) {
                msNum = 0;
                clearTime();
            } else {
                msNum -= 1000;
                timer = setTimeout(arguments.callee, 1000);
            }
        })();
    
        function clearTime() {
            clearTimeout(timer);
            $el.prop("disabled", false).removeClass("disabled").text(text);
        }
    
        function showTime(ms) {
            var d = Math.floor(ms / 1000 / 60 / 60 / 24),
                    h = Math.floor(ms / 1000 / 60 / 60 % 24),
                    m = Math.floor(ms / 1000 / 60 % 60),
                    s = Math.floor(ms / 1000 % 60),
                    ss = Math.floor(ms / 1000);
    
            return {
                d: d + "天",
                h: h + "小时",
                m: m + "分",
                ss: ss + "秒",
                "d:h:m:s": d + "天" + h + "小时" + m + "分" + s + "秒",
                "h:m:s": h + "小时" + m + "分" + s + "秒",
                "m:s": m + "分" + s + "秒"
            };
        }
    
        return this;
    }
    ↓ 查看全文

    jquery倒计时按钮常用于验证码倒计时按钮由懒人建站收集整理,您可以自由传播,请主动带上本文链接

    快乐十分玩法与奖金就是免费分享,觉得有用就多来支持一下,没有能帮到您,懒人也只能表示遗憾,希望有一天能帮到您。

    jquery倒计时按钮常用于验证码倒计时按钮-最新评论

    • Jquery特效 2016-12-28 08:41:09
      倒计时按钮简单实用
    • 11 2016-12-28 08:12:09
      倒计时按钮简单实用
  • 金灿荣 美国想遏制中国根本不可能, 我们和苏联不一样! 2018-12-09
  • 到户就不是计划经济,统一经营坚持集体的是计划经济。 2018-11-30
  • 过半美国人希望“特普”会面 以期改善美俄关系 2018-11-24
  • 专家:美方一意孤行 必将损人害己 2018-11-22
  • 【克山天气】最新克山今天天气,实时提供克山气温、空气质量、24小时天气预报、生活指数查询 2018-11-22
  • 每逢佳节酒席多,随不起的份子伤不起的面子 2018-11-20
  • 今年回南天为何掉线了?这其实并不奇怪 2018-11-16
  • 清热-热门标签-华商生活 2018-11-16
  • 服装业华丽转身后面临渠道尴尬 2018-11-12
  • 亲信干政案一审宣判:朴槿惠被判24年监禁 罚款180亿韩元 2018-11-12
  • 国台办主任张志军赴金门参访 2018-11-06
  • 【学习时刻学思践悟十九大⑥】光明日报王丹:中国书写“最成功的脱贫故事” 2018-11-03
  • 天润·西山农牧场亚心网第十届全民植树节举行 2018-11-03
  • 悦读 —频道 春城壹网 七彩云南 一网天下 2018-10-31
  • 做法-热门标签-华商生活 2018-10-28
  • 616| 603| 264| 103| 318| 723| 90| 581| 846| 961|