jszs 历史管理

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script type="text/javascript">
window.onload = function ()
{
    var odiv = document.getElementById(‘div1‘);
    var obtn = document.getElementById(‘btn‘);

    obtn.onclick = function ()
    {
        var number = randnew(35,7);

        odiv.innerHTML = number;
        history.pushState(number,‘‘);        

    }

    window.onpopstate = function (ev)
    {
        var number = ev.state||‘‘;
        odiv.innerHTML = number;
    }

    function randnew(alls,news)
    {
        var arr = [];
        var newarr = [];
        for(var i = 1; i <= alls; i++)
        {
            arr.push(i);
        }

        for( var i = 0; i < news; i++)
        {
            newarr.push(arr.splice(Math.floor(Math.random()*arr.length),1));
        }

        return newarr;
    }
};
</script>
</head>

<body>
<input id="btn" type="button" value="35选7">
<div id="div1"></div>
</body>
</html>
时间: 2024-07-29 15:49:15

jszs 历史管理的相关文章

HTML5实战与剖析之历史管理(history对象)

HTML5新添加了对历史的管理,更新了history对象让管理历史状态更加方便了.在现代Web应用中,用户可以通过"前进"和"后退"按钮进行历史页面的切换.这让一些不在新页面中打开的新页面前进后退自如,提高了用户体验. 通过haschange事件,可以知道URL的参数什么时候发生了变化,也就是什么时候该有所反应.通过状态管理的API,能够在不加载新页面的情况下改变浏览器的URL.所以需要使用history.pushState()方法.history.pushStat

html5 历史管理

1.onhashchange:改变hash值来进行历史管理. 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <input type="button" value="随机选择" id="

历史管理

历史管理 •onhashchange  :改变hash值来管理 window.location.hash=''; window.onhashchange=function(){} •history  : –服务器下运行 –pushState :  三个参数 :数据  标题(都没实现)  地址(可选) –popstate事件 :  读取数据   event.state –注意:网址是虚假的,需在服务器指定对应页面,不然刷新找不到页面

HTML5自学笔记[ 8 ]历史管理

触发历史管理的三种方法: 跳转页面 改变hash值 pushState(在服务器环境下运行) 用hash值来触发历史管理: 1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <title>随机产生彩票号码</title> 5 <meta charset="utf-8"/> 6 <script> 7 window.onload = func

html5的onhashchange和history历史管理

html5的onhashchange和history历史管理 现在的开发,越来越倾向于页面内跳转,这种情况下需要更新自己的知识,来实现页面内跳转.history就是解决这个问题的. HTML5有两种解决办法: 1,onhashchange 用到了window.loaction.hash对象(存,取) 2,history (1) pushstate 三个参数:数据,标题(为空),url(可选). (2) popstate是一个事件,读取event.state数据 注意:url是虚假的.用户不能实际

HTML5历史管理

边看视频边做的练习,随机选彩票demo 分别使用history和hash来实现 <!doctype html> <html> <head> <meta charset="utf-8" > <title>随机选彩票</title> <style type="text/css"> *{ padding: 0; margin: 0; } #btn1,#div1{ margin: 10px;

历史管理-onhashchange&amp;window.history

网页记录历史记录两种方法 1.onhashchange事件  改变hash值来管理 hash值:http://test.con#hash #后面内容即为hash值 设置网页的hash值  window.location.hash = "要设置的hash值" 获取hash值:var hash = window.location.hash.substring(1);//去掉#号 直接修改网址的hash值,不刷新页面,是不会显示hash指定的模块,此时需要用到onhashchange事件 修

html5 - history 历史管理

参考文章: w3c     :  http://www.w3.org/html/ig/zh/wiki/HTML5/history 张鑫旭  : http://www.zhangxinxu.com/wordpress/2013/06/html5-history-api-pushstate-replacestate-ajax/ zawa   :  http://zawa.iteye.com/blog/1271031 Demo : Demo 截图: 代码: <!DOCTYPE html PUBLIC

历史管理 onhashchange

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-