亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

手機(jī)注冊發(fā)送驗證碼倒計時的簡單實例

 更新時間:2017年11月15日 08:31:47   作者:creatP  
下面小編就為大家分享一篇手機(jī)注冊發(fā)送驗證碼倒計時的簡單實例。具有很好的參考價值,一起跟隨小編過來看看吧,希望對大家有所幫助

如下所示:

()這里用的是input做的點擊發(fā)送驗證碼
<input type="number" class="input" name="mobile" placeholder="手機(jī)號" style="border: none"

<input class="hui_kuang"style="width: 30%;text-align: center;height: 42px"onclick="setTime(this)" value='獲取驗證碼'>
<script>
  
//頁面初始化獲取倒計時數(shù)字(避免在倒計時時用戶刷新瀏覽器導(dǎo)致倒計時歸零)
 var $getCodeInput = $(".hui_kuang");
 var sessionCountdown = sessionStorage.getItem("countdown");
 if (!sessionCountdown) {
  $(".hui_kuang").val("獲取驗證碼")
 } else {
  $(".hui_kuang").val("重新發(fā)送(" + sessionCountdown + ")");
  setCode($getCodeInput, sessionCountdown);
 }
 //獲取驗證碼
 function setTime() {
  var remobile = $("#registForm input[name='mobile']").val();
  if (!remobile) {
   alert("請輸入手機(jī)號碼")
   return;

  }
  if (!(/^1[3|4|5|8][0-9]\d{4,8}$/.test(remobile))) {
   alert("請輸入有效的手機(jī)號碼")
   return;
  } else {
   setCode($getCodeInput, 60);
  }

 }
 //發(fā)送驗證碼倒計時
 function setCode($getCodeInput, countdown) {
  if (countdown == 0) {
   $getCodeInput.attr('disabled', false);
//   $getCodeInput.removeAttribute("disabled");
   $getCodeInput.val("獲取驗證碼");
   sessionStorage.removeItem("countdown");
   return;
  } else {
   $getCodeInput.attr('disabled', true);
   $getCodeInput.val("重新發(fā)送(" + countdown + ")");
   countdown--;
  }
  sessionStorage.setItem("countdown", countdown);
  window.setTimeout(function () {
   setCode($getCodeInput, countdown);
  }, 1000);
 }
</script>

以上這篇手機(jī)注冊發(fā)送驗證碼倒計時的簡單實例就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。

相關(guān)文章

  • JS數(shù)據(jù)結(jié)構(gòu)之隊列結(jié)構(gòu)詳解

    JS數(shù)據(jù)結(jié)構(gòu)之隊列結(jié)構(gòu)詳解

    這篇文章主要為大家詳細(xì)介紹了JavaScript數(shù)據(jù)結(jié)構(gòu)與算法中的隊列結(jié)構(gòu),文中通過簡單的示例介紹了隊列結(jié)構(gòu)的原理與實現(xiàn),需要的可以參考一下
    2022-11-11
  • 淺談Layui的eleTree樹式選擇器使用方法

    淺談Layui的eleTree樹式選擇器使用方法

    今天小編就為大家分享一篇淺談Layui的eleTree樹式選擇器使用方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
    2019-09-09
  • 微信小程序開發(fā)之選項卡(窗口底部TabBar)頁面切換

    微信小程序開發(fā)之選項卡(窗口底部TabBar)頁面切換

    本文主要介紹了微信小程序開發(fā)之選項卡(窗口底部TabBar)頁面切換的相關(guān)知識。具有很好的參考價值。下面跟著小編一起來看下吧
    2017-04-04
  • javascript事件問題

    javascript事件問題

    咱們都知道,在DOM事件模型中,有捕獲和冒泡兩個階段,而在IE事件模型中,只有冒泡階段。寫在html里的事件響應(yīng)函數(shù)只有在冒泡階段才會被執(zhí)行
    2009-09-09
  • 微信小程序事件綁定傳參冒泡及捕獲的示例詳解

    微信小程序事件綁定傳參冒泡及捕獲的示例詳解

    這篇文章主要為大家介紹了微信小程序事件綁定傳參冒泡及捕獲的示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步早日升職加薪
    2022-04-04
  • 原生js獲取left值和top值的三種方法

    原生js獲取left值和top值的三種方法

    下面小編就為大家?guī)硪黄鷍s獲取left值和top值的三種方法。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2017-08-08
  • 關(guān)于Blog頂部的滾動導(dǎo)航條代碼

    關(guān)于Blog頂部的滾動導(dǎo)航條代碼

    關(guān)于Blog頂部的滾動導(dǎo)航條代碼...
    2006-09-09
  • 原生js實現(xiàn)表單的正則驗證(驗證通過后才可提交)

    原生js實現(xiàn)表單的正則驗證(驗證通過后才可提交)

    這篇文章主要給大家介紹了關(guān)于如何利用原生js實現(xiàn)表單的正則驗證,所有驗證都通過后提交按鈕才可用的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2021-05-05
  • 詳解webpack import()動態(tài)加載模塊踩坑

    詳解webpack import()動態(tài)加載模塊踩坑

    這篇文章主要介紹了詳解webpack import()動態(tài)加載模塊踩坑,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2018-07-07
  • bootstrap3-dialog-master模態(tài)框使用詳解

    bootstrap3-dialog-master模態(tài)框使用詳解

    這篇文章主要為大家詳細(xì)介紹了bootstrap3-dialog-master模態(tài)框的使用方法,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2017-08-08

最新評論