h5--history(历史管理)
历史管理:
- onhashchange:事件,当hash值有变化的时候,就会触发.
<input id="input1" type="button" value="35选7"></input> <div id="div1"></div> <script type="text/javascript"> window.onload = function(){ var oInput = document.getElementById('input1'); var oDiv =document.getElementById('div1'); var obj = {}; oInput.onclick = function(){ var number = randomNum(35,7); oDiv.innerHTML = number; var oRD = Math.random(); obj[oRD] = number; window.location.hash = oRD; }; window.onhashchange = function(){ var number = obj[window.location.hash.substring(1)]||""; oDiv.innerHTML = number; } } function randomNum(alls,now){ var arr = []; var newArr=[]; for(var i=1;i<=alls;i++){ arr.push(i); } for(var i=0;i<now;i++){ newArr.push(arr.splice(Math.floor(Math.random()*arr.length),1)); } return newArr; } </script>
- history --pushState
--popstate
window.onload = function(){ var oInput = document.getElementById('input1'); var oDiv =document.getElementById('div1'); var obj = {}; oInput.onclick = function(){ var number = randomNum(35,7); oDiv.innerHTML = number; history.pushState(number,"");//第二个参数为空即可,第三个参数是可选的网址变化 }; window.onpopstate=function(ev){ var number = ev.state||''; oDiv.innerHTML = number; } } function randomNum(alls,now){ var arr = []; var newArr=[]; for(var i=1;i<=alls;i++){ arr.push(i); } for(var i=0;i<now;i++){ newArr.push(arr.splice(Math.floor(Math.random()*arr.length),1)); } return newArr; }