javascript模拟随机彩票，用hash来记录每一组值

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        #con{width: 300px; height: 150px; border:5px solid blue;}
    </style>
</head>
<body>
<input type="button" value="获取随机彩票" id="btn"/>
<div id="con"></div>
<script type="text/javascript">
    //将随机彩票和历史记录关联起来
    window.onload = function(){
        //定义变量
        var oBtn = document.getElementById('btn');
        var oCon = document.getElementById('con');
        var json = {}; //保存 随机数的每一个数组
        //绑定事件
        oBtn.onclick = function(){
            //随机生成json数据的key
            var key = Math.random()*100;
            //获取随机数
            var numArr = getRandom(7,1,36);
            //console.log(numArr);
            //将获取到的随机数保存到 json
            json[key] = numArr;
            //console.log(json);
            //将当前随机数保存到hash中
            //hash中只能保存字符串或数字
            window.location.hash = key;
            //将随机数保存 到 con中
            oCon.innerHTML = numArr;
        }
        //触发获取历史记录的事件
        //hash值发生改变时才会触发
        //使用hash值保存数据，可以用于 框架的url跳转  ，框架的路由
        window.onhashchange = function(){
            console.log(window.location.hash);//#35.68357723215734
            //删除hash的#
            var num = window.location.hash.substring(1);//json的key
            //升级版？ 需要判断是否存在该值，如果不存在，请给出提示 
            if(json[num] != undefined){
                oCon.innerHTML = json[num];
            }else{
                oCon.innerHTML = '';
            }
        }
        //获取多个随机数的函数 num=7，start= 1，end=36
        //升级小函数，让他具备去重的功能
        function getRandom(num,start,end){
            //定义一个空数组
            var numA = [];
            for(var i=0;i<num;i++){
                var num1 = Math.floor(Math.random()*(end-start)+start);
                //将获取的随机数保存到 numA
                //去重
                if(numA.indexOf(num1) != -1){//重复的处理
                    i--;
                }else{//不重复的处理
                    numA.push(num1);
                }
            }
            return numA;
        }
    }
</script>
</body>
</html>
javascript模拟随机彩票，用hash来记录每一组值

猜你喜欢
