复选框(全、单选)angular实现(待完善........)

7 篇文章 0 订阅
<td id="label-week">
                    <label for="week-ck-all" ng-class="{active:all}">全<input type="checkbox" id="week-ck-all" ng-model="all" ng-click="chooseAllDay('all')"></label>
                    <label for="week-ck-mon"  ng-class="{active:chk1ed}">一<input type="checkbox" id="week-ck-mon" ng-click="chooseSingleDay(1,chk1ed)"></label>
                    <label for="week-ck-tue"  ng-class="{active:chk2ed}">二<input type="checkbox" id="week-ck-tue"  ng-click="chooseSingleDay(2,chk2ed)"></label>
                    <label for="week-ck-thi"  ng-class="{active:chk3ed}">三<input type="checkbox" id="week-ck-thi"  ng-click="chooseSingleDay(3,chk3ed)"></label>
                    <label for="week-ck-thu"  ng-class="{active:chk4ed}">四<input type="checkbox" id="week-ck-thu"  ng-click="chooseSingleDay(4,chk4ed)"></label>
                    <label for="week-ck-fri"  ng-class="{active:chk5ed}">五<input type="checkbox" id="week-ck-fri"  ng-click="chooseSingleDay(5,chk5ed)"></label>
                    <label for="week-ck-sat"  ng-class="{active:chk6ed}">六<input type="checkbox" id="week-ck-sat"  ng-click="chooseSingleDay(6,chk6ed)"></label>
                    <label for="week-ck-fri"  ng-class="{active:chk7ed}">日<input type="checkbox" id="week-ck-fri"  ng-click="chooseSingleDay(7,chk7ed)"></label>
                </td>
var dayz=[];
    var weekday_range=0;

    //设置选中标记
    function setCheckFlag(day,flag){

        switch(day)
        {
            case 1:
                $scope.chk1ed=!flag;
              break;
            case 2:
                $scope.chk2ed=!flag;
              break;
            case 3:
                $scope.chk3ed=!flag;
              break;
            case 4:
                $scope.chk4ed=!flag;
              break;
            case 5:
                $scope.chk5ed=!flag;
              break;
            case 6:
                $scope.chk6ed=!flag;
              break;
            case 7:
                $scope.chk7ed=!flag;
              break;
            case 'all':
                $scope.chk1ed=flag;
                $scope.chk2ed=flag;
                $scope.chk3ed=flag;
                $scope.chk4ed=flag;
                $scope.chk5ed=flag;
                $scope.chk6ed=flag;
                $scope.chk7ed=flag;

              break;
        }
    }   
    //选择全部星期

    $scope.chooseAllDay=function(all){
        if($scope.all){
            dayz=[];
            dayz.push(1,2,3,4,5,6,7,'all');
        }else{
            dayz=[];
        }
        setCheckFlag('all',$scope.all);
        if(dayz.indexOf('all')!=-1){
            weekday_range=0;
        }else{
            weekday_range=dayz.join(',');
        }
        // console.log(weekday_range);

    }

    //选择部分星期
    $scope.chooseSingleDay=function(day,flag){
        if(flag){
            $scope.all=false;
            setCheckFlag(day,flag);
            console.log(dayz);
            if(dayz.indexOf('all')!=-1){
                dayz.splice(dayz.indexOf('all'),1)
            }
            dayz.splice(dayz.indexOf(day),1)

            // console.log(day+"--"+dayz.indexOf(day))
            // console.log();
        }else{
            setCheckFlag(day,flag)
            dayz.push(day);
            if(dayz.length==7){
                $scope.all=true;
                dayz.push('all');
            }
        }

        if(dayz.indexOf('all')!=-1){
            weekday_range=0;
        }else{
            weekday_range=dayz.join(',');
        }

        // console.log(weekday_range)
    }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值