AngularJS 驗證碼60秒倒計時功能的實現(xiàn)
更新時間：2017年06月05日 14:31:55 作者：青_zq
最近在做AngularJS 項目，這是寫的一個60秒倒計時功能，下面小編給大家介紹AngularJS 驗證碼60秒倒計時功能的實現(xiàn)，需要的朋友參考下吧
最近在做AngularJS 項目，這是寫的一個60秒倒計時, angularjs 與jq不同， 不是使用dom節(jié)點操作，而是數(shù)據(jù)操作，寫倒計時，最好是使用$timeout與$interval ，不要使用settimeout與setinterval 。$timeout與$interval 可使綁定數(shù)據(jù)直接更新。
html
<a href="javascript:" rel="external nofollow" ng-click="sendphonecode(reg_phone)" ng-class="paraclass" ng-bind="paracont">獲取驗證碼</a>
angularjs
angular.module('controllers', []).controller('registerCtrl', function($scope,$interval){
$scope.paracont = "獲取驗證碼";
$scope.paraclass = "but_null";
$scope.paraevent = true;
var second = 60,
timePromise = undefined;
timePromise = $interval(function(){
if(second<=0){
$interval.cancel(timePromise);
timePromise = undefined;
second = 60;
$scope.paracont = "重發(fā)驗證碼";
$scope.paraclass = "but_null";
$scope.paraevent = true;
}else{
$scope.paracont = second + "秒后可重發(fā)";
$scope.paraclass = "not but_null";
second--;
}
},1000,100);
});
以上所述是小編給大家介紹的AngularJS 驗證碼60秒倒計時功能的實現(xiàn)，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關(guān)文章
詳談angularjs中路由頁面強(qiáng)制更新的問題
下面小編就為大家?guī)硪黄斦刟ngularjs中路由頁面強(qiáng)制更新的問題。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-04-04
AngularJS $on、$emit和$broadcast的使用
本文主要介紹AngularJS $on、$emit和$broadcast的使用,這里整理了詳細(xì)的資料及簡單示例代碼有興趣的小伙伴可以參考下2016-09-09
這篇文章主要介紹了ng-alain的sf如何自定義部件,本文通過實例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2020-06-06
本篇文章主要介紹了詳解Angular2組件之間如何通信，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-06-06
本篇文章主要介紹了詳解基于angular路由的requireJs按需加載js，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-01-01
解決angular雙向綁定無效果,ng-model不能正常顯示的問題
今天小編就為大家分享一篇解決angular雙向綁定無效果,ng-model不能正常顯示的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-10-10
Angular 4中如何顯示內(nèi)容的CSS樣式示例代碼
這篇文章主要給大家介紹了關(guān)于Angular 4中如何顯示內(nèi)容的CSS樣式的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2017-11-11
本文主要介紹AngularJS 一些優(yōu)化上的小技巧，這里整理了幾種方法供大家參考，有興趣的小伙伴可以參考下2016-08-08
在我們開發(fā)中經(jīng)常需要在頁面顯示給用戶的信息需要一定處理格式化，才能顯示給用戶。比如時間本地化，或者yyyy-MM-dd HH:mm:ss格式，數(shù)字精度格式化，本地化，人名格式化等等。在angularjs中為我們提供了叫filter的指令，讓我們能夠很輕易就能做到著一些列的功能2015-05-05
Angular.js中$apply()和$digest()的深入理解
相信大家都知道$digest()和$apply()是AngularJS中的兩個核心并且有時候容易引人誤解的部分。我們需要深入理解這兩者是如何運作的，從而才能理解AngularJS本身是如何運作的。本文的目的就是介紹$digest()和$apply()是如何確確實實的對你有用的。下面來一起看看吧。2016-10-10