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>

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

  • 相关阅读:
    flume和kafka整合(转)
    Flume目录
    Flume的安装配置
    HBase系统架构及数据结构(转)
    toolbar ,textfield,图片拉伸,Bundle
    poj 1017 Packets
    jQuery使用serialize(),serializeArray()方法取得表单数据+字符串和对象类型两种表单提交的方法
    Android数据加密概述及多种加密方式 聊天记录及账户加密 提供高质量的数据保护
    LintCode-落单的数 III
    LeetCode90:Subsets II
  • 原文地址:https://www.cnblogs.com/hack-ing/p/6242935.html
Copyright © 2011-2022 走看看