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 相关文章推荐
学习ExtJS(二) Button常用方法
Oct 07 Javascript
struts2 jquery 打造无限层次的树
Oct 23 Javascript
jQuery中.live()方法的用法深入解析
Dec 30 Javascript
jquery插件格式实例分析
Jun 16 Javascript
jquery轮播的实现方式 附完整实例
Jul 28 Javascript
javascript中的 object 和 function小结
Aug 14 Javascript
AngularJS基于ui-route实现深层路由的方法【路由嵌套】
Dec 14 Javascript
javascript中数组(Array)对象和字符串(String)对象的常用方法总结
Dec 15 Javascript
javascript实现动态显示颜色块的报表效果
Apr 10 Javascript
JavaScript之面向对象_动力节点Java学院整理
Jun 29 Javascript
详解webpack3如何正确引用并使用jQuery库
Aug 26 jQuery
js Date()日期函数浏览器兼容问题解决方法
Sep 12 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
20个PHP常用类库小结
2011/09/11 PHP
php中替换字符串中的空格为逗号','的方法
2014/06/09 PHP
ThinkPHP中pathinfo的访问模式、路径访问模式及URL重写总结
2014/08/23 PHP
php生成年月日下载列表的方法
2015/04/24 PHP
php多进程并发编程防止出现僵尸进程的方法分析
2020/02/28 PHP
PHP7 其他修改
2021/03/09 PHP
超酷的网页音乐播放器DewPlayer使用方法
2010/12/18 Javascript
js使下拉列表框可编辑不止是选择
2013/12/12 Javascript
Node.js安装教程和NPM包管理器使用详解
2014/08/16 Javascript
AngularJS入门教程之AngularJS指令
2016/04/18 Javascript
Nodejs抓取html页面内容(推荐)
2016/08/11 NodeJs
jQuery动画_动力节点节点Java学院整理
2017/07/04 jQuery
浅谈原生JS中的延迟脚本和异步脚本
2017/07/12 Javascript
Vue绑定内联样式问题
2018/10/17 Javascript
javascript设计模式 ? 简单工厂模式原理与应用实例分析
2020/04/09 Javascript
angula中使用iframe点击后不执行变更检测的问题
2020/05/10 Javascript
javascript+css实现俄罗斯方块小游戏
2020/06/28 Javascript
js+canvas实现图片格式webp/png/jpeg在线转换
2020/08/22 Javascript
VUE-ElementUI 自定义Loading图操作
2020/11/11 Javascript
使用python在校内发人人网状态(人人网看状态)
2014/02/19 Python
python实现的希尔排序算法实例
2015/07/01 Python
Python的for和break循环结构中使用else语句的技巧
2016/05/24 Python
浅谈Django中的数据库模型类-models.py(一对一的关系)
2018/05/30 Python
python调用Matplotlib绘制分布点并且添加标签
2018/05/31 Python
Django中数据库的数据关系:一对一,一对多,多对多
2018/10/21 Python
详解python中的hashlib模块的使用
2019/04/22 Python
python暴力解压rar加密文件过程详解
2019/07/05 Python
pycharm双击无响应(打不开问题解决办法)
2020/01/10 Python
Python项目跨域问题解决方案
2020/06/22 Python
详解移动端HTML5音频与视频问题及解决方案
2018/08/22 HTML / CSS
bonprix匈牙利:女士、男士和儿童服装
2019/07/19 全球购物
打架检讨书100字
2014/01/08 职场文书
小学节能减排倡议书
2014/05/15 职场文书
五一活动标语
2014/06/30 职场文书
交警正风肃纪剖析材料
2014/10/29 职场文书
禁毒心得体会范文
2016/01/15 职场文书