加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

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

发布时间:2020-12-17 09:34:29 所属栏目:安全 来源:网络整理
导读: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 =
<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)
    }

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读