web前端-js-九宫格抽奖

        // 抽奖
        var arr = [1, 2, 3, 4, 5, 6, 7, 8],
            lottery = document.querySelector('#cjlist'),
            start = document.querySelector('#start'),
            ali = lottery.querySelectorAll('li');
        var i = 0, //转到哪个位置
            count = 0, //转圈初始值
            totalCount = 6, //转动的总圈数
            speed = 300, //转圈速度，越大越慢
            minSpeed = 100,
            timer,
            isClick = true;

        function roll() {
            speed -= 50;
            if (speed <= 10) {
                speed = 10;
            }
            for (var j = 0; j < ali.length; j++) {
                ali[j].classList.remove('on');
            }
            i++;
            //计算转圈次数
            if (i >= ali.length) {
                i = 0;
                count++;
            }
            ali[i].classList.add('on'); //添加变色类名
            //满足转圈数和指定位置就停止
            if (count >= totalCount && (i + 1) == index) {
                clearTimeout(timer);
                isClick = true;
                speed = minSpeed;
            } else {
                timer = setTimeout(roll, speed); //不满足条件时调用定时器
                if (count >= totalCount - 1 || speed <= 50) {
                    speed += 100;
                }
            }
        }
        start.onclick = function () {
            console.log('抽奖');
            if (isClick) {
                count = 0;
                index = Math.floor(Math.random() * arr.length + 1); // 随机产生中奖位置
                roll();
                isClick = false;
            }
        }