保存页面的浏览记录

我的设计思想是将用户的浏览记录保存到cookie里面,然后根据情况处理。cookie里面的数据格式是json格式,方便根据自己的需要添加或者修改属性。
引用了3个js文件,下载地址如下。

https://github.com/carhartl/jquery-cookie/blob/master/jquery.cookie.js

https://github.com/douglascrockford/JSON-js/blob/master/json2.js

http://jquery.com/

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <title>浏览记录</title>
 5     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 6     <script type="text/javascript" src="../js/jquery-1.9.1.min.js"></script>
 7     <script type="text/javascript" src="../js/jquery.cookie.js"></script>
 8     <script type="text/javascript" src="../js/json2.js"></script>
 9     <script type="text/javascript">
10         String.prototype.format = function (args) {
11             if (arguments.length > 0) {
12                 var result = this;
13                 if (arguments.length == 1 && typeof (args) == "object") {
14                     for (var key in args) {
15                         var reg = new RegExp("({" + key + "})", "g");
16                         result = result.replace(reg, args[key]);
17                     }
18                 }
19                 else {
20                     for (var i = 0; i < arguments.length; i++) {
21                         if (arguments[i] == undefined) {
22                             return "";
23                         }
24                         else {
25                             var reg = new RegExp("({[" + i + "]})", "g");
26                             result = result.replace(reg, arguments[i]);
27                         }
28                     }
29                 }
30                 return result;
31             }
32             else {
33                 return this;
34             }
35         }
36 
37         //添加一个新的浏览记录
38         function addHistory(productName, url) {
39             var historyArr = getHistory();
40             historyArr.push({'productName':productName, 'url':url});
41             $.cookie('overviewHistory', JSON.stringify(historyArr), { expires:7, path:'/' });
42         }
43         //获取所有的浏览记录
44         function getHistory() {
45             var overviewHistory = $.cookie('overviewHistory');
46             if (typeof overviewHistory === "undefined") {
47                 return []
48             } else {
49                 return eval("(" + overviewHistory + ")");
50             }
51         }
52         //将浏览记录显示到相应的元素里面
53         function updateHistoryEle() {
54             var historyArr = getHistory();
55             historyArr.reverse()
56             //设置最大的显示数量
57             while (historyArr.length > 10) {
58                 historyArr.pop()
59             }
60             for (i = 0; i < historyArr.length; i++) {
61                 $('<div><a href="{1}">{0}</a></div>'.format(historyArr[i].productName, historyArr[i].url)).appendTo('#history');
62             }
63         }
64 
65         $(function () {
66             addHistory("亲的", "www.baidu.com")
67             updateHistoryEle()
68         })
69     </script>
70 </head>
71 <body>
72 <div id="history">
73 
74 </div>
75 </body>
76 </html>

 

转载于:https://www.cnblogs.com/qinying/archive/2013/06/08/3127140.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/376616.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

开窍小老虎,一步一个脚印之 初识汇编(一)

最近一直浸淫在计算机编程中无法自拔。哲学 认识论中讲过。人类的求知的过程是由两次飞跃。第一是从感性认识到理性认识&#xff1b;第二是从理性认识到实践。这段话对有些人是适用的。我就是其中的一名。在知乎上求助问题“学计算机要懂汇编吗&#xff1f;”&#xff0c;地下有…

python脚本 请求数量达到上限,http请求重试

由于在内网发送http请求同一个token会限制次数&#xff0c;所以很容易达到网关流量上限。 业务中使用了多线程并发&#xff0c;一个线程发起一次http请求&#xff0c;得到正确结果后返回。这里采用的策略是&#xff0c;如果解析出来达到流量上限&#xff0c;那么该线程休眠一段…

shell 字符串操作

string"abcABC123ABCabc" 字符串长度: echo ${#string} #15 echo expr length $string #15 索引 用法&#xff1a;expr index $string $substring expr index $string "ABC" #4 提取子串 用法&#xff1a;${string:position} echo ${string:3} #A…

Linux 之目录 -鸟哥的Linux私房菜

因为利用 Linux 来开发产品或 distributions 的社群/公司与个人实在太多了, 如果每个人都用自己的想 法来配置档案放置的目录,那么将可能造成很多管理上的困扰。 你能想象,你进入一个企业之后,所 接触到的 Linux 目录配置方法竟然跟你以前学的完全不同吗? 很难想象吧~所以,后来…

python脚本:向表中插入新数据,删除表中最旧的数据

一张表存储历史数据&#xff0c;最多存储HISTORY_TABLE_MAX_ROWS条数据&#xff0c;当表中数据未达到HISTORY_TABLE_MAX_ROWS&#xff0c;直接插入&#xff1b;如果达到的话需要保证插入新数据的时候将最旧的数据删除 这里使用先update最新数据&#xff0c;然后再重新update全表…

精通 VC++ 实效编程280例 - 02 菜单和光标

菜单和关闭时重要的 Windows 资源之一。SDK 中&#xff0c;用 HCURSOR 和 HMENU 分别表示菜单和光标的句柄。MFC 中&#xff0c;CMenu 类封装了菜单的功能。 23 动态添加和删除菜单项 添加菜单项可以调用 CMenu::AppendMenu 或 CMenu::InserMenu 函数&#xff0c;删除菜单项可以…

POJ 1860: Currency Exchange 【SPFA】

套汇问题&#xff0c;从源点做SPFA&#xff0c;如果有一个点入队次数大于v次&#xff08;v表示点的个数&#xff09;则图中存在负权回路&#xff0c;能够套汇&#xff0c;如果不存在负权回路&#xff0c;则判断下源点到自身的最长路是否大于自身&#xff0c;使用SPFA时松弛操作…

python脚本:判断字符是否为中文

# 判断字符是否为中文 def is_chinese(ch):if u\u4e00 < ch < u\u9fff:return Trueelse:return False

Android 广播 Broadcast学习

Android Broadcast 广播 进程内本地广播 如果你是在你的应用之内使用广播&#xff0c;即不需要跨进程&#xff0c;考虑使用LocalBroadcastManager &#xff0c;这样更有效率&#xff08;因为不需要跨进程通信&#xff09;&#xff0c;并且你不用考虑一些其他应用可以发送或接收…

python:将时间戳转换成格式化日期

import time # 将时间戳转换成格式化日期 def timestamp_to_str(timestampNone, format%Y-%m-%d %H:%M:%S):if timestamp:time_tuple time.localtime(timestamp) # 把时间戳转换成时间元祖result time.strftime(format, time_tuple) # 把时间元祖转换成格式化好的时间retur…

WebApp 里Meta标签大全

1.先说说mate标签里的viewport&#xff1a; viewport即可视区域&#xff0c;对于桌面浏览器而言&#xff0c;viewport指的就是除去所有工具栏、状态栏、滚动条等等之后用于看网页的区域。对于传统WEB页面来说&#xff0c;980的宽度在iphone上显示是很正常的&#xff0c;也是满屏…

python:封装CRUD操作

# 封装数据库操作 def SELECT(db, cursor, sql):try:# 执行SQL语句db.ping(reconnectTrue)cursor.execute(sql)# 获取所有记录列表results cursor.fetchall()logging.debug("select commit")except:logging.error(sql)logging.error("select 语句执行出错"…

我的osu游戏程序设计(oo)

osu是一款社区元素为主旨的音乐游戏,由澳大利亚人Dean Herbert (peppy)独立制作并运行. 游戏的方法简单,就是 1. 圈圈(Circle)&#xff1a;圈圈(Circle) 50。没打中显示X,并减少生命值。圈中序号的最后一个的300、100会显示为激300、喝100。2.滑条(Slider) : 在开始端点击按住不…

影像数据库调研

参考Paul Graham比较各种编程语言的方法&#xff0c;我们比较各种数据库的特点如下&#xff1a; Oracle: 我们需要企业级数据库。 MySQL: Oracle不开源。 PostgreSQL: MySQL的功能不够多。 SQLite: 你可以把我嵌入到任何地方。这样&#xff0c;4种数据库够大家用了。 MongoDB: …

linux进程间通信快速入门【三】:信号量(XSI、POSIX以及PV原语)

文章目录XSIsemgetsemop、semtimedopsemctl基于共享内存demo修改XSI信号量的限制PV原语PV控制并发进程数POSIX信号量使用posix命名信号量使用posix匿名信号量参考在前两篇文章中我们使用的racingdemo都没有对临界区代码进行加锁&#xff0c;这里我们介绍以下信号量的使用。Linu…

QTableWidget的使用详细介绍和美工总结(转)

基本外观设置 FriendTable->setFrameShape(QFrame::NoFrame); //设置边框 FriendTable->setHorizontalHeaderLabels(HeadList); 设置表头 FriendTable->setSelectionMode(QAbstractItemView::SingleSelection); 设置选择的模式为单选择 FriendTable->setSelect…

Android programming on Mac 之安装Eclipse

1.安装包在此链接下载&#xff1a; http://developer.android.com/sdk/index.html google GoAgent翻墙不好用&#xff0c;更新了host文件也不行&#xff0c;整了半天&#xff0c;还是一怒之下续签了vpn账号。早知如此&#xff0c;何必折腾。~~~~(>_<)~~~~ 更新文件时…

c++关于虚表的一些笔记

文章目录1、虚函数表指针2、多态构成的条件3、重载、重写、重定义 三者区别4、继承与虚函数5、单继承中的虚函数表无虚函数覆盖有虚函数覆盖6、单继承中的虚函数表无虚函数覆盖有虚函数覆盖参考看《深度探索c对象模型》的时候对虚表有了点疑惑&#xff0c;正好网上有些文章解除…

4、在Shell程序中的使用变量

学习目标变量的赋值变量的访问变量的输入 12-4-1 变量的赋值在Shell编程中&#xff0c;所有的变量名都由字符串组成&#xff0c;并且不需要对变量进行声明。要赋值给一个变量&#xff0c;其格式如下&#xff1a;变量名值。注意&#xff1a;等号()前后没有空格例如&#xff1a; …

C语言技巧:把单一元素的数组放在末尾,struct可以拥有可变大小的数组

《C 对象模型》第19页有这样一句话 C程序员的巧计有时候却成为c程序员的陷阱。例如把单一元素的数组放在一个struct的末尾&#xff0c;于是每个struct objects可以拥有可变数组的数组&#xff1a; struct mumble {/* stuff */char pc[1]; };//从文件或标准输入装置中取得一个…