小练习3:随机数字定时生成(抽奖)

985 阅读1分钟
  • 本次小练习做一个抽奖程序,页面中有一个区域显示中奖人员的编号,在JS中写一段代码,要求每隔1秒中随机创建一个四位的数字(每一位数字的取值范围0-9),当10秒结束后,结束定时器,最后显示的四位数字即是中奖的号码
  • 此次小练习主要完成随机数的生成和定时部分
  • JS的生成随机数主要通过Math的random方法获得0-1的随机数,再通过相乘取整等方法获得想要的随机数,再通过数组的一系列方法获得返回值。函数如下:
    function getNumber(){
        var ary = [];
        while(ary.length<4){
            var cur = Math.round(Math.random()*9);//取出的随机整数
            if(ary.indexOf(cur) === -1){ //说明数组没有这一项
                ary.push(cur);
            }
        }
        return ary.join("");//把数组的每一项靠一起返回
    }
  • JS的定时部分函数如下:
    var i = 0;//为了知道现在是第几秒
    var timer = window.setInterval(function(){
        i++;
        oSpan.innerHTML = getNumber();
        if(i ===10){
            clearInterval(timer);
            timer = null;
        }
    },1000);
  • 最后效果如图: