<meter id="7ntxv"></meter>

<b id="7ntxv"><listing id="7ntxv"><ol id="7ntxv"></ol></listing></b>
<nobr id="7ntxv"></nobr><mark id="7ntxv"></mark>

    <p id="7ntxv"><menuitem id="7ntxv"><font id="7ntxv"></font></menuitem></p>
    <sub id="7ntxv"><menuitem id="7ntxv"><meter id="7ntxv"></meter></menuitem></sub>

    <mark id="7ntxv"></mark>
    <meter id="7ntxv"><var id="7ntxv"></var></meter>

    知識 分享 互助 懶人建站

      懶人建站專注于網頁素材下載,提供網站模板、網頁設計、ps素材、圖片素材等,服務于【個人站長】【網頁設計師】和【web開發從業者】的代碼素材與設計素材網站。

      懶人建站提供網頁素材下載、網站模板
      知識 分享 互助!

      jquery倒計時按鈕常用于驗證碼倒計時按鈕

      作者:佳明媽 來源:鄭州網站建設 2016-12-24 人氣:
      jquery倒計時按鈕代碼,常用于驗證碼倒計時按鈕,代碼效果就是點擊按鈕以后按鈕上面會出現倒計時讀數,倒計時的時間可以自行指定,按鈕倒計時的格式有4中格式可選。

      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開發從業者】的代碼素材與設計素材網站。
      //懶人建站http://www.waidid2022.com/
      //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倒計時按鈕常用于驗證碼倒計時按鈕-最新評論

      亚洲免费的黄色网站_黄色网站在线放久操射视频_A片www.黄色网站成年人_天天干 天天操天天干

      <meter id="7ntxv"></meter>

      <b id="7ntxv"><listing id="7ntxv"><ol id="7ntxv"></ol></listing></b>
      <nobr id="7ntxv"></nobr><mark id="7ntxv"></mark>

        <p id="7ntxv"><menuitem id="7ntxv"><font id="7ntxv"></font></menuitem></p>
        <sub id="7ntxv"><menuitem id="7ntxv"><meter id="7ntxv"></meter></menuitem></sub>

        <mark id="7ntxv"></mark>
        <meter id="7ntxv"><var id="7ntxv"></var></meter>