JQ模态框+简易评价

EvaCourse:function(){//课程评价
        
        var p=['不好','一般','不错','很好','非常好'],
            $mask=$(".mask"),//遮罩
             $starBox=$("#star-box"),//评价触发盒子
             $modalBox=$(".modal-box"),//弹出框
             $pText=$("#text-info"),//'不好','一般','不错','很好','非常好' 显示信息
             $subtn=$("#star-btn"),//提交按钮
             $inputTxt=$("#input-txt"),//输入文本框
             $starList=$("#star-list");//评论星星列表
        
        //点击评价星星、显示遮罩和评价框
        $starBox.click(function(){
            openBox();
        });
        
        
        $mask.click(function(){
            closeBox();
        });
        
        $subtn.click(function(){
            closeBox();
        });
        
        //点击评价星星切换对应评价
        $starList.on('click','li',function(){
            $index=$(this).index();
            console.log($index)
            switch($index){
                case 0:
                    $("#star-list>li").removeClass('active').eq($index).addClass('active');
                    $pText.text(p[$index]);
                    break;
                case 1:
                    removeClass();
                    $("#star-list>li:lt(2)").addClass('active');
                    $pText.text(p[$index]);
                    break;
                case 2:
                    removeClass();
                    $("#star-list>li:lt(3)").addClass('active');
                    $pText.text(p[$index]);
                    break;
                case 3:
                    removeClass();
                    $("#star-list>li:lt(4)").addClass('active');
                    $pText.text(p[$index]);
                    break;
                case 4:
                    removeClass();
                    $("#star-list>li:lt(5)").addClass('active');
                    $pText.text(p[$index]);
                    break;
            }
        });
        function removeClass(){
                $("#star-list>li").removeClass('active');
        }
        function openBox(){//打开遮罩和评价框
            $mask.show();
            $modalBox.show();
        }
        function closeBox(){//关闭遮罩和评价框
            $mask.hide();
            $modalBox.hide();
        }
    }

 

转载于:https://www.cnblogs.com/xzma/p/7268535.html