历史管理 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-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script> //onhashchange : 事件:当hash值有变化的时候,就会触发 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>
</head> <body>
<input type="button" value="35选7" id="input1" />
<div id="div1"></div>
</body>
</html>
历史管理 onhashchange的更多相关文章
- html5 历史管理onhashchange和state
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- HTML5自学笔记[ 8 ]历史管理
触发历史管理的三种方法: 跳转页面 改变hash值 pushState(在服务器环境下运行) 用hash值来触发历史管理: <!doctype html> <html lang=&q ...
- HTML5历史管理
边看视频边做的练习,随机显示数字,分别使用history和hash来实现历史管理 <!doctype html> <html> <head> <meta ch ...
- html5 历史管理
1.onhashchange:改变hash值来进行历史管理. <!DOCTYPE html> <html> <head> <meta charset=&quo ...
- Clipboard Action for Mac(智能剪贴板历史管理器)破解版安装
1.软件简介 Clipboard Action 是 macOS 系统上一款智能剪贴板历史管理器,它允许剪贴板历史中的每一段内容执行操作.使用 AppleScript 或 Automator 工作 ...
- pjax 历史管理 jQuery.History.js
更新 http://www.bootcdn.cn/jquery.pjax/ 简介 pjax是一个jQuery插件,使用ajax和pushState技术提供快速的浏览体验与真正的永久链接.网页标题.以及 ...
- html5 - history 历史管理
参考文章: w3c : http://www.w3.org/html/ig/zh/wiki/HTML5/history 张鑫旭 : http://www.zhangxinxu.com/wo ...
- html5(历史管理)
<!DOCTYPE html> <head> <meta http-equiv="Content-Type" content="text/h ...
- HTML5历史管理状态机制
前言:想要不刷新页面同时改变url 可以用HTML5 window对象的 hashChange 事件.同时介绍两个相关的api 和 1个事件. 两个API:1.history.pushState({n ...
随机推荐
- APOSE.Cell导入图片
一:读取EXcel单元格图片 1:读取全部单元格的图片集合 worksheet.pictureCollotion 2:遍历pictureCollotion (foreach (var pic ...
- [ACM] hdu 1285 确定比赛名次 (拓扑排序)
确定比赛名次 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Subm ...
- Swift异常处理
在Swift里,抛出的异常必须继承Error这个协议.那么这个协议是什么呢? 按住command再点击Error我们可以看到, public protocol Error { } extension ...
- lightoj1001【简单题】
题意: 一个人的值不能超过10: #include<stdio.h> #include<queue> #include<string.h> #include< ...
- Node.js 的回调模式
我们都知道在javaScript中,如果在head标签里面引入script脚本,在打开web的时候,浏览器会先加载head中的信息,再加载body的信息: 如果head中有link标签,浏览器会开启一 ...
- native-echarts 在安卓上无法显示出来
1.native-echarts 的配置是百度echarts 2.模拟器上试了很多次都显示不出来(具体不清楚,我的是这样) 3.真机测试可以显示图表,以下是配置: a.将node_modules\na ...
- B - Dungeon Master POJ - 2251
//纯bfs #include <iostream> #include <algorithm> #include <cstring> #include <cs ...
- 应用日志获取-web系统
1 场景 应用使开发写的,但应用使部署再服务器上,而开发没有ssh登陆服务器的权限. so,开发总是请运维查日志,下载日志. so and so,运维要花很多时间帮开发去搞日志. 这是件很没意义的事, ...
- ajax中get和post区别
参考地址:http://blog.csdn.net/laijieyao/article/details/40426257 首先要明确的事$.get方法是使用GET方式进行异步请求.$.post方法使用 ...
- Java集合框架常见面试题
点击关注公众号及时获取笔主最新更新文章,并可免费领取本文档配套的<Java面试突击>以及Java工程师必备学习资源. 剖析面试最常见问题之Java基础知识 说说List,Set,Map三者 ...