<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
        主站蜘蛛池模板: 美女被cao网站免费看在线看| 亚洲午夜福利精品无码| 国产高清免费观看| 中文字幕亚洲综合久久2| 亚洲精品色在线网站| 国产精品视频免费| 亚洲日本va午夜中文字幕久久| 亚洲乱码卡三乱码新区| 久久久精品午夜免费不卡| 亚洲国产高清精品线久久| 亚洲欧美日韩国产精品一区| 精品无码无人网站免费视频| 美女羞羞免费视频网站| 久久成人18免费网站| 久久成人国产精品免费软件| 国产成人亚洲综合| 黄页免费视频播放在线播放| 成人毛片免费网站| 四虎必出精品亚洲高清| 亚洲毛片免费观看| 国产一级一片免费播放i| 亚洲中文字幕无码一久久区| 青青青亚洲精品国产| 成人一a毛片免费视频| 亚洲国产精品综合久久久| 久久99青青精品免费观看| 日日夜夜精品免费视频| 亚洲色精品VR一区区三区| 日韩精品无码区免费专区| 亚洲最大的视频网站| 波多野结衣免费在线观看| 亚洲欧洲视频在线观看| 一区二区三区在线免费观看视频| 深夜国产福利99亚洲视频| 亚洲福利电影一区二区?| 久久狠狠躁免费观看| 亚洲色成人网一二三区| 69av免费视频| 亚洲成a人片在线不卡| 拍拍拍又黄又爽无挡视频免费| 亚洲一级特黄特黄的大片|