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 相关文章推荐
符合W3C网页标准的iframe标签的使用方法
Jul 19 Javascript
火狐浏览器(firefox)下获得Event对象以及keyCode
Nov 13 Javascript
ext combox 下拉框不出现自动提示,自动选中的解决方法
Feb 24 Javascript
跨浏览器的 mouseenter mouseleave 以及 compareDocumentPosition的使用说明
May 04 Javascript
js解析json读取List中的实体对象示例
Mar 11 Javascript
JavaScript结合AJAX_stream实现流式显示
Jan 08 Javascript
JavaScript通过function定义对象并给对象添加toString()方法实例分析
Mar 23 Javascript
Angular2 之 路由与导航详细介绍
May 26 Javascript
详解vscode中vue代码颜色插件
Oct 11 Javascript
详解vue中router-link标签所必备了解的属性
Apr 15 Javascript
js canvas实现5张图片合成一张图片
Jul 15 Javascript
JSONP解决JS跨域问题的实现
May 25 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 session文件独占锁引起阻塞问题解决方法
2015/05/12 PHP
laravel model模型处理之修改查询或修改字段时的类型格式案例
2019/10/17 PHP
JavaScript类库D
2010/10/24 Javascript
TinyMCE 新增本地图片上传功能
2010/11/05 Javascript
HTML5附件拖拽上传drop &amp; google.gears实现代码
2011/04/28 Javascript
面向对象的Javascript之三(封装和信息隐藏)
2012/01/27 Javascript
了解一点js的Eval函数
2012/07/26 Javascript
Chrome下ifame父窗口调用子窗口的问题示例探讨
2014/03/17 Javascript
AngularJS仿苹果滑屏删除控件
2016/01/18 Javascript
详解微信开发中snsapi_base和snsapi_userinfo及静默授权的实现
2017/03/11 Javascript
Vue.2.0.5过渡效果使用技巧
2017/03/16 Javascript
nodejs动态创建二维码的方法
2017/08/12 NodeJs
深入理解ES6的迭代器与生成器
2017/08/19 Javascript
理解Koa2中的async&amp;await的用法
2018/02/05 Javascript
详解vue 路由跳转四种方式 (带参数)
2019/04/28 Javascript
JS使用H5实现图片预览功能
2019/09/30 Javascript
从零学Python之入门(四)运算
2014/05/27 Python
Python文件及目录操作实例详解
2015/06/04 Python
Python面向对象编程基础解析(二)
2017/10/26 Python
Python实现OpenCV的安装与使用示例
2018/03/30 Python
Python 2/3下处理cjk编码的zip文件的方法
2019/04/26 Python
使用python进行波形及频谱绘制的方法
2019/06/17 Python
python 模拟贷款卡号生成规则过程解析
2019/08/30 Python
django框架基于queryset和双下划线的跨表查询操作详解
2019/12/11 Python
Django 实现将图片转为Base64,然后使用json传输
2020/03/27 Python
详解CSS3原生支持div铺满浏览器的方法
2018/08/30 HTML / CSS
澳大利亚游乐场设备品牌:Lifespan Kids
2019/05/24 全球购物
2014学年自我鉴定
2014/02/23 职场文书
买卖协议书范本
2014/04/21 职场文书
企业形象策划方案
2014/05/29 职场文书
学习优秀共产党员先进事迹思想报告
2014/09/17 职场文书
初一年级组工作总结
2015/08/12 职场文书
浅谈TypeScript 索引签名的理解
2021/10/16 Javascript
Python中递归以及递归遍历目录详解
2021/10/24 Python
Python Matplotlib绘制两个Y轴图像
2022/04/13 Python
Java死锁的排查
2022/05/11 Java/Android