js 实现浏览历史记录示例


Posted in Javascript onApril 20, 2014

先必须要引用一个js jquery.cookie.js

1,首先写入jsCookied

//浏览记录 写入JSCookied 开始 
var img=$("#ProductImgurl").attr("jqimg"); 
var name=$("#ProductDetail_ctl00_LabelName").text(); 
var url=location.href; 
var price=$("#ProductDetail_ctl00_LabelShopPrice").text(); 
var sellcount=$("#ProductDetail_ctl00_lblSaleNumber").text(); 
var hc=img+"|"+name+"|"+url+"|"+price+"|"+sellcount; 
if($.cookie("history")!=null) 
{ 
if($.cookie("history").indexOf(name)==-1) 
{ $.cookie("history",hc+"*"+$.cookie("history"),{expires:8,domain:'.groupfly.com',path:"/"}); 
} 
} 
else 
{ 
$.cookie("history",hc,{expires:8,domain:'.groupfly.com',path:"/"}); 
} 
//浏览记录 写入JSCookied 结束

2,然后再读取Cookied
<script type="text/javascript" charset="utf-8"> 
//读取cookied历史记录 
$(function(){ var hc=$.cookie("history"); 
if(hc!=null) 
{ 
if(hc.indexOf("*")!=-1) 
{ 
var splithtml=hc.split("*"); 
var xhtml=new Array(); 
var hlength=splithtml.length; 
if(parseInt(hlength)>4) 
hlength=4; 
for(var i=0;i<parseInt(hlength);i++) 
{ 
xhtml.push('<div class="tuijian"><div class="tjname"><a href="'+splithtml[i].split("|")[2]+'">'+splithtml[i].split("|")[1].substr(0, 17)+'</a></div>'); 
xhtml.push('<div class="tjimga"><a href="'+splithtml[i].split("|")[2]+'"><img src="'+splithtml[i].split("|")[0]+'_160x160.jpg" alt="'+splithtml[i].split("|")[1]+'" /></a><p>¥'+splithtml[i].split("|")[3]+'</p></div>'); 
xhtml.push('<div class="otherInfo clearfix"><span>已销售<b>'+splithtml[i].split("|")[4]+'</b>笔</span><a href="'+splithtml[i].split("|")[2]+'">再看看</a></div></div>'); 
} 
xhtml.push('<div class="tr"><a href="javascript:clearcookied();">清空记录</a></div>'); 
$("#MyHistory").append(xhtml.join("")); 
} 
else{ 
var xhtml=new Array(); 
xhtml.push('<div class="tuijian"><div class="tjname"><a href="'+hc.split("|")[2]+'">'+hc.split("|")[1].substr(0, 17)+'</a></div>'); 
xhtml.push('<div class="tjimga"><a href="'+hc.split("|")[2]+'"><img src="'+hc.split("|")[0]+'_160x160.jpg" alt="'+hc.split("|")[1]+'" /></a><p>¥'+hc.split("|")[3]+'</p></div>'); 
xhtml.push('<div class="otherInfo clearfix"><span>已销售<b>'+hc.split("|")[4]+'</b>笔</span><a href="'+hc.split("|")[2]+'">再看看</a></div></div>'); 
xhtml.push('<div class="tr"><a href="javascript:clearcookied();">清空记录</a></div>'); 
$("#MyHistory").append(xhtml.join("")); 
} 
} 
else 
{ 
$("#MyHistory").append("<li>暂无浏览记录</li>"); 
} 
}); 
function clearcookied() 
{ 
$.cookie('history',null,{expires:1,domain:'.nrqiang.com'}); 
$("#MyHistory").html("<li>暂无浏览记录</li>"); 
} 
$(function() { 
$("img").each(function(){$(this).attr("src",$(this).attr("original"));}); 
}); 
</script>
Javascript 相关文章推荐
[原创]来自ImageSee官方 JavaScript图片浏览器
Jan 16 Javascript
将HTML格式的String转化为HTMLElement的实现方法
Aug 07 Javascript
node.js中的Socket.IO使用实例
Nov 04 Javascript
JS中字符串trim()使用示例
May 26 Javascript
EditPlus中的正则表达式 实战(4)
Dec 15 Javascript
js实现tab选项卡切换功能
Jan 13 Javascript
基于JS实现仿百度百家主页的轮播图效果
Mar 06 Javascript
jQuery插件HighCharts绘制2D金字塔图效果示例【附demo源码下载】
Mar 09 Javascript
JavaScript递归算法生成树形菜单
Aug 15 Javascript
angularjs实现天气预报功能
Jun 16 Javascript
javascript性能优化之分时函数的介绍
Mar 28 Javascript
Vue中用JSON实现刷新界面不影响倒计时
Oct 26 Javascript
jquery的trigger和triggerHandler的区别示例介绍
Apr 20 #Javascript
js的参数有长度限制吗?发现不能超过2083个字符
Apr 20 #Javascript
给html超链接设置事件不使用href来完成跳
Apr 20 #Javascript
jQuery响应enter键的实现思路
Apr 18 #Javascript
jquery easyui 结合jsp简单展现table数据示例
Apr 18 #Javascript
jQuery如何取id有.的值一般的方法是取不到的
Apr 18 #Javascript
用jquery仿做发微博功能示例
Apr 18 #Javascript
You might like
基于php中使用excel的简单介绍
2013/08/02 PHP
php自定义的格式化时间示例代码
2013/12/05 PHP
php使用cookie保存登录用户名的方法
2015/01/26 PHP
WAMP环境中扩展oracle函数库(oci)
2015/06/26 PHP
Yii框架where查询用法实例分析
2019/10/22 PHP
php设计模式之工厂方法模式分析【星际争霸游戏案例】
2020/01/23 PHP
解决JS浮点数运算出现Bug的方法
2013/03/12 Javascript
jQuery查询数据返回object和字符串影响原因是什么
2013/08/09 Javascript
解决Jquery load()加载GB2312页面时出现乱码的两种方案
2013/09/10 Javascript
node.js中的path.normalize方法使用说明
2014/12/08 Javascript
node.js中的fs.renameSync方法使用说明
2014/12/16 Javascript
js获取checkbox值的方法
2015/01/28 Javascript
javascript函数的四种调用模式
2017/01/08 Javascript
JS实现json的序列化和反序列化功能示例
2017/06/13 Javascript
JS实现静态页面搜索并高亮显示功能完整示例
2017/09/19 Javascript
使用clipboard.js实现复制功能的示例代码
2017/10/16 Javascript
js使用xml数据载体实现城市省份二级联动效果
2017/11/08 Javascript
深入浅出 Vue 系列 -- 数据劫持实现原理
2019/04/23 Javascript
vue实现配置全局访问路径头(axios)
2019/11/01 Javascript
详解vue父子组件状态同步的最佳方式
2020/09/10 Javascript
[01:00:25]NB vs Secret 2018国际邀请赛小组赛BO1 B组加赛 8.19
2018/08/21 DOTA
[42:32]完美世界DOTA2联赛PWL S2 LBZS vs FTD.C 第二场 11.27
2020/12/01 DOTA
python web框架学习笔记
2016/05/03 Python
浅谈python内置变量-reversed(seq)
2017/06/21 Python
python贪吃蛇游戏代码
2020/04/18 Python
django 基于中间件实现限制ip频繁访问过程详解
2019/07/30 Python
基于python和flask实现http接口过程解析
2020/06/15 Python
基于Tensorflow读取MNIST数据集时网络超时的解决方式
2020/06/22 Python
WiFi云数码相框:Nixplay
2018/07/05 全球购物
JD Sports丹麦:英国领先的运动时尚零售商
2020/11/24 全球购物
文明寝室申报材料
2014/05/12 职场文书
服务承诺书怎么写
2014/05/24 职场文书
《文化苦旅》读后感:阅读,让人诗意地栖居在大地上
2019/12/24 职场文书
Python中json.load()和json.loads()有哪些区别
2021/06/07 Python
【2·13】一图读懂中国无线电发展
2022/02/18 无线电
SpringBoot集成MongoDB实现文件上传的步骤
2022/04/18 MongoDB