关闭

angularjs 验证码60秒倒计时

标签: angularjs60秒验证码手机验证码发送
11229人阅读 评论(0) 收藏 举报
分类:

最近在做angularjs 项目,这是写的一个60秒倒计时,  angularjs 与jq不同, 不是使用dom节点操作,而是数据操作,写倒计时,最好是使用$timeout与$interval ,不要使用settimeout与setinterval 。    $timeout与$interval 可使绑定数据直接更新。


html

<a href="javascript:" 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 = "重发验证码";
            $scope.paraclass = "but_null";
            $scope.paraevent = true;
          }else{
            $scope.paracont = second + "秒后可重发";
            $scope.paraclass = "not but_null";
            second--;
           
          }
        },1000,100);
});






1
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:40771次
    • 积分:551
    • 等级:
    • 排名:千里之外
    • 原创:15篇
    • 转载:12篇
    • 译文:0篇
    • 评论:4条
    文章分类
    最新评论