zoukankan      html  css  js  c++  java
  • html5 历史管理onhashchange和state

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <script>
     window.onload=function(){
            var oin=document.getElementById('input1');
            var odiv=document.getElementById('div1');
            var json={};
            oin.onclick=function(){
                /*随机获取num值*/
                var num=Math.random();
                 /*获取随机7位数*/
                var arr=randomNum(35,7);
               /* 随机索引存arr随机7位数*/
                json[num] =arr;
                odiv.innerHTML=arr;
                window.location.hash=num;
            }
            window.onhashchange=function(){
                odiv.innerHTML=json[window.location.hash.substring(1)];
            }
    
           function randomNum(iAll,iNow)
           {
                var arr=[];
                var newArr=[];
                for(var i=1; i<iAll; i++){
                    arr.push(i);
                    }
                    for(var i=0; i<iNow; i++)
                    {
                        newArr.push(arr.splice(Math.floor(Math.random()*arr.length),1));
                    }
                    return newArr;
           }
     }
    </script>
    <body>
        <input type="button" value="随机选择" id="input1">
        <div id="div1"></div>
    </body>
    </html>

    随机数组的的索引存值

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <script>
     window.onload=function(){
            var oin=document.getElementById('input1');
            var odiv=document.getElementById('div1');
            oin.onclick=function(){
              var arr=randomNum(35,7);
              /*要存的数组*/
              history.pushState(arr,'');
              odiv.innerHTML=arr;
            };
            /*取数组的函数*/
            window.onpopstate=function(ev)
            {
              odiv.innerHTML=ev.state;
            }
    
           function randomNum(iAll,iNow)
           {
                var arr=[];
                var newArr=[];
                for(var i=1; i<iAll; i++){
                    arr.push(i);
                    }
                    for(var i=0; i<iNow; i++)
                    {
                        newArr.push(arr.splice(Math.floor(Math.random()*arr.length),1));
                    }
                    return newArr;
           }
     }
    </script>
    <body>
        <input type="button" value="随机选择" id="input1">
        <div id="div1"></div>
    </body>
    </html>

    此方法只适合在服务器上使用

  • 相关阅读:
    网上搜索整理的前端开发工程师面试题附答案
    Python-RabbitMQ-topic(细致消息过滤的广播模式)
    Python-RabbitMQ-direct(广播模式)
    Python-RabbitMQ-fanout(广播模式)
    rabbitmq中关于exchange模式type报错
    Python-RabbitMQ(持久化)
    Python-RabbitMQ(简单发送模型)
    python-gevent模块实现socket大并发
    python-gevent模块(自动切换io的协程)
    python-greenlet模块(协程)
  • 原文地址:https://www.cnblogs.com/hack-ing/p/6242935.html
Copyright © 2011-2022 走看看