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 相关文章推荐
下载站控制介绍字数显示的脚本 显示全部 隐藏介绍等功能
Sep 19 Javascript
javascript parseInt 大改造
Sep 27 Javascript
父元素与子iframe相互获取变量和元素对象的具体实现
Oct 15 Javascript
JQuery EasyUI 数字格式化处理示例
May 05 Javascript
JavaScript中的Math.LOG2E属性使用详解
Jun 14 Javascript
javascript控制层显示或隐藏的方法
Jul 22 Javascript
jquery对复选框(checkbox)的操作汇总
Jan 13 Javascript
JavaScript的ExtJS框架中表格的编写教程
May 21 Javascript
史上最全JavaScript数组去重的十种方法(推荐)
Aug 17 Javascript
JavaScript事件对象event用法分析
Jul 27 Javascript
创建echart多个联动的示例代码
Nov 23 Javascript
jquery.pager.js实现分页效果
Jul 29 jQuery
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初学者头痛的十四个问题
2006/07/12 PHP
PHP易混淆知识整理笔记
2015/09/24 PHP
Symfony2创建基于域名的路由相关示例
2016/11/14 PHP
PHP开发之归档格式phar文件概念与用法详解【创建,使用,解包还原提取】
2017/11/17 PHP
javascript function调用时的参数检测常用办法
2010/02/26 Javascript
jquery插件jquery倒计时插件分享
2013/12/27 Javascript
JavaScript 作用域链解析
2014/11/13 Javascript
高性能JavaScript模板引擎实现原理详解
2015/02/05 Javascript
iScroll中事件点击触发两次解决方案
2015/03/11 Javascript
微信企业号开发之微信考勤Cookies的使用
2015/09/11 Javascript
angularJS+requireJS实现controller及directive的按需加载示例
2017/02/20 Javascript
使用原生的javascript来实现轮播图
2017/02/24 Javascript
重新理解JavaScript的六种继承方式
2017/03/24 Javascript
JavaScript实现网页头部进度条刷新
2017/04/16 Javascript
vue-cli入门之项目结构分析
2017/04/20 Javascript
使用store来优化React组件的方法
2017/10/23 Javascript
ES6 系列之 WeakMap的使用示例
2018/08/06 Javascript
Vue2.0点击切换类名改变样式的方法
2018/08/22 Javascript
修改vue+webpack run build的路径方法
2018/09/01 Javascript
es6基础学习之解构赋值
2018/12/10 Javascript
在layui中select更改后生效的方法
2019/09/05 Javascript
使用localStorage替代cookie做本地存储
2019/09/25 Javascript
微信小程序批量监听输入框对按钮样式进行控制的实现代码
2019/10/12 Javascript
[01:29:46]DOTA2上海特级锦标赛C组资格赛#1 OG VS LGD第二局
2016/02/27 DOTA
python实现dnspod自动更新dns解析的方法
2014/02/14 Python
Python常用特殊方法实例总结
2019/03/22 Python
Python (Win)readline和tab补全的安装方法
2019/08/27 Python
Python3自动生成MySQL数据字典的markdown文本的实现
2020/05/07 Python
工作中个人的自我评价
2013/12/31 职场文书
企业消防安全制度
2014/02/02 职场文书
网络宣传方案
2014/03/15 职场文书
法语专业求职信
2014/07/20 职场文书
2015年学校消防安全工作总结
2015/10/14 职场文书
mysql批量新增和存储的方法实例
2021/04/07 MySQL
MySQL中出现乱码问题的终极解决宝典
2021/05/26 MySQL
MongoDB数据库部署环境准备及使用介绍
2022/03/21 MongoDB