<span id="mktg5"></span>

<i id="mktg5"><meter id="mktg5"></meter></i>

        <label id="mktg5"><meter id="mktg5"></meter></label>
        最新文章專題視頻專題問答1問答10問答100問答1000問答2000關鍵字專題1關鍵字專題50關鍵字專題500關鍵字專題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關鍵字專題關鍵字專題tag2tag3文章專題文章專題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專題3
        問答文章1 問答文章501 問答文章1001 問答文章1501 問答文章2001 問答文章2501 問答文章3001 問答文章3501 問答文章4001 問答文章4501 問答文章5001 問答文章5501 問答文章6001 問答文章6501 問答文章7001 問答文章7501 問答文章8001 問答文章8501 問答文章9001 問答文章9501
        當前位置: 首頁 - 科技 - 知識百科 - 正文

        使用Angular.js獲取驗證碼倒計時60秒按鈕方法

        來源:懂視網 責編:小采 時間:2020-11-27 20:06:58
        文檔

        使用Angular.js獲取驗證碼倒計時60秒按鈕方法

        使用Angular.js獲取驗證碼倒計時60秒按鈕方法:最近做項目的時候又遇到了驗證碼倒計時的需求,發現這個功能還是挺實用的,所以就想著總結一下,本文主要給大家介紹了關于利用Angular.js如何實現獲取驗證碼倒計時按鈕的簡單方法,需要的朋友可以參考借鑒,下面來一起看看吧。前言本文主要介紹了關于Angu
        推薦度:
        導讀使用Angular.js獲取驗證碼倒計時60秒按鈕方法:最近做項目的時候又遇到了驗證碼倒計時的需求,發現這個功能還是挺實用的,所以就想著總結一下,本文主要給大家介紹了關于利用Angular.js如何實現獲取驗證碼倒計時按鈕的簡單方法,需要的朋友可以參考借鑒,下面來一起看看吧。前言本文主要介紹了關于Angu
        最近做項目的時候又遇到了驗證碼倒計時的需求,發現這個功能還是挺實用的,所以就想著總結一下,本文主要給大家介紹了關于利用Angular.js如何實現獲取驗證碼倒計時按鈕的簡單方法,需要的朋友可以參考借鑒,下面來一起看看吧。

        前言

        本文主要介紹了關于Angular.js實現獲取驗證碼倒計時60秒按鈕的相關內容,關于這個功能相信不用多介紹,大家都不陌生,所以下面話不多說了,來一起看看實現的方法吧。

        一、controller中代碼

        angular.module('controllers')
         .controller('LoginCtrl', function ($scope, $location,$ionicLoading,$rootScope,$interval,$timeout) {
         $scope.timer = false;
         $scope.timeout = 60000;
         $scope.timerCount = $scope.timeout / 1000;
         $scope.text = "獲取驗證碼";
         $scope.onClick = function(){
         $scope.showTimer = true;
         $scope.timer = true;
         $scope.text = "秒后重新獲取";
         var counter = $interval(function(){
         $scope.timerCount = $scope.timerCount - 1;
         }, 1000);
         $timeout(function(){
         $scope.text = "獲取驗證碼";
         $scope.timer = false;
         $interval.cancel(counter);
         $scope.showTimer = false;
         $scope.timerCount = $scope.timeout / 1000;
         }, $scope.timeout);
         };
         });

        二、html頁面中

        <button class="yz-btn" ng-click="onClick()" ng-disabled="timer"><span ng-if="showTimer">{{timerCount}}</span>{{text}}</button>

        注:

        1.class="yz-btn"為button的樣式,可自己修改;

        2.ng-disabled="timer"控制button是否可以點擊;

        3.ng-if="showTimer"控制數字顯示;

        4.ng-click="onClick()"觸發效果,文字text默認“獲取驗證碼”,點擊之后為“60s后重新獲取”。

        三、效果圖

        1、點擊前


        2、點擊后

        聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

        文檔

        使用Angular.js獲取驗證碼倒計時60秒按鈕方法

        使用Angular.js獲取驗證碼倒計時60秒按鈕方法:最近做項目的時候又遇到了驗證碼倒計時的需求,發現這個功能還是挺實用的,所以就想著總結一下,本文主要給大家介紹了關于利用Angular.js如何實現獲取驗證碼倒計時按鈕的簡單方法,需要的朋友可以參考借鑒,下面來一起看看吧。前言本文主要介紹了關于Angu
        推薦度:
        • 熱門焦點

        最新推薦

        猜你喜歡

        熱門推薦

        專題
        Top
        主站蜘蛛池模板: 亚洲字幕AV一区二区三区四区| 亚洲国产精品久久久久婷婷软件 | 亚洲熟妇AV日韩熟妇在线| 99精品视频免费在线观看| 国产亚洲一区二区手机在线观看 | 日韩免费无码一区二区三区 | 亚洲一区二区免费视频| 四虎1515hh永久久免费| 亚洲免费一级视频| 久久久久久免费视频| 久久久久se色偷偷亚洲精品av | 亚洲第一页日韩专区| 黄色毛片免费在线观看| 亚洲七七久久精品中文国产| 亚洲成AV人片在WWW| www亚洲精品少妇裸乳一区二区| 成年免费a级毛片| 亚洲精品无码成人AAA片| 精品免费tv久久久久久久| 老司机亚洲精品影院| 亚洲精品动漫免费二区| 亚洲AV第一成肉网| 中文字幕亚洲图片| 99久久久国产精品免费牛牛| 亚洲无圣光一区二区| 女人毛片a级大学毛片免费| 美女尿口扒开图片免费| 亚洲中文字幕无码久久综合网| 免费无码又爽又刺激高潮视频| 亚洲三级视频在线| 波多野结衣中文一区二区免费| 中国一级特黄的片子免费| 亚洲色av性色在线观无码| 精品久久洲久久久久护士免费| 九九九国产精品成人免费视频| 亚洲AV第一页国产精品| 一二三四免费观看在线电影| 羞羞视频免费网站日本| 久久亚洲美女精品国产精品 | 永久黄网站色视频免费直播| 一个人免费观看www视频|