js 抽奖转盘实现

今天用js实现转盘抽奖功能，从后台返回的值可以固定转盘选择停止的任意位置

实现代码如下：

js：

<script>
        var auto, count = 0, i = 0;//auto:时间对象 count：计数器 ，i ： 计数器
        var resultCode = "";//后台返回的结果的值
        var arry = [ "1", "2", "3", "4", "5", "6", "7","8"]; //返回值的数组，图片以数组中的数字命名
        function turn() {
            /// <summary>
            /// 转盘旋转
            /// </summary>
            i = (i == arry.length - 1) ? 0 : i + 1;
            $("#imgTurn").attr("src", "/Content/Images/" + arry[i] + ".png");

            //以下调整可以设置转盘转速
            if (count < 20) {
                auto = setTimeout(turn, 80);
            } else if (count >= 20 && count < 30) {
                auto = setTimeout(turn, 120);
            } else if (count >= 30 && count < 40) {
                auto = setTimeout(turn, 160);
            } else if (count >= 40 && count < 50) {
                auto = setTimeout(turn, 280);
            } else if (count >= 50 && count < 60) {
                auto = setTimeout(turn, 500);
            }
            else {
                auto = setTimeout(turn, 1000);
            }
            if (arry[i] == resultCode) {
                //当等于后台返回的值的时候停止转
                count = 0;
                resultCode = 0;
                clearTimeout(auto);

                $("#but_bulliondraw").bind("click", fun);
             
                return;
            }
            count += 1;
        }


        function beginTurn() {
            /// <summary>
            /// 开始旋转
            /// </summary>
            /// <returns type=""></returns>
            if (count == 0) {
                $("#imgTurn").attr("src", "/Content/Images/" + arry[i] + ".png");
                turn();
                return true;
            } else {
                return false;
            }
        }
        
        $(function () {
            //点击开始旋转
            $("#but_bulliondraw").bind("click", fun);
        });
        var fun = function () {
            $("#but_bulliondraw").unbind("click");
            if (beginTurn()) {
                //这里可以从后台请求返回的值，赋值给resultCode
                setTimeout(function () { resultCode = 2 }, 5000);
            }
        };
    </script>

html代码：

 <div style="margin:0 auto; width:500px;">
      <p>
          <img src="/Content/Images/orderedList0.png" id="imgTurn" />@*默认有一张全部亮的图片*@
      </p>
        <input type="button" id="but_bulliondraw" value="开始抽奖" />
    </div>