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 相关文章推荐
Array.slice()与Array.splice()的返回值类型
Oct 09 Javascript
IE8 引入跨站数据获取功能说明
Jul 22 Javascript
关于延迟加载JavaScript
May 05 Javascript
搞定immutable.js详细说明
May 02 Javascript
Javascript中字符串相关常用的使用方法总结
Mar 13 Javascript
JS实现的简单拖拽购物车功能示例【附源码下载】
Jan 03 Javascript
如何从零开始利用js手写一个Promise库详解
Apr 19 Javascript
解决select2在bootstrap modal中不能正常使用的问题
Aug 09 Javascript
vue-cli 3.x 配置Axios(proxyTable)跨域代理方法
Sep 19 Javascript
学习RxJS之JavaScript框架Cycle.js
Jun 17 Javascript
基于PHP pthreads实现多线程代码实例
Jun 24 Javascript
vue中使用echarts的示例
Jan 03 Vue.js
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 filter_var() 函数 Filter 函数
2012/04/25 PHP
php5.3 goto函数介绍和示例
2014/03/21 PHP
php遍历目录方法小结
2015/03/10 PHP
Laravel 5 框架入门(四)完结篇
2015/04/09 PHP
PHP从尾到头打印链表实例讲解
2018/09/27 PHP
PHP实现批量修改文件名的方法示例
2019/09/18 PHP
13 个JavaScript 性能提升技巧分享
2012/07/26 Javascript
javascript自然分类法算法实现代码
2013/10/11 Javascript
自己使用jquery写的一个无缝滚动的插件
2014/04/30 Javascript
jQuery响应鼠标事件并隐藏与显示input默认值
2014/08/24 Javascript
JavaScript的原型继承详解
2015/02/15 Javascript
JavaScript常用数组算法小结
2016/02/13 Javascript
1秒50万字!js实现关键词匹配
2016/08/01 Javascript
详解vue.js移动端导航navigationbar的封装
2017/07/05 Javascript
微信小程序实现语音识别转文字功能及遇到的坑
2019/08/02 Javascript
python连接远程ftp服务器并列出目录下文件的方法
2015/04/01 Python
Python+matplotlib+numpy绘制精美的条形统计图
2018/01/02 Python
Python爬虫实例_城市公交网络站点数据的爬取方法
2018/01/10 Python
python2.7实现邮件发送功能
2018/12/12 Python
Python嵌套式数据结构实例浅析
2019/03/05 Python
python定时按日期备份MySQL数据并压缩
2019/04/19 Python
anaconda如何查看并管理python环境
2019/07/05 Python
python写入文件自动换行问题的方法
2019/07/05 Python
Django 缓存配置Redis使用详解
2019/07/23 Python
基于MSELoss()与CrossEntropyLoss()的区别详解
2020/01/02 Python
Pycharm中切换pytorch的环境和配置的教程详解
2020/03/13 Python
Python %r和%s区别代码实例解析
2020/04/03 Python
Python使用itcaht库实现微信自动收发消息功能
2020/07/13 Python
基于html和CSS3制作酷炫的导航栏
2015/09/23 HTML / CSS
Canvas系列之滤镜效果
2019/02/12 HTML / CSS
巴西购物网站:Estrela10
2018/12/13 全球购物
HomeAway澳大利亚:预订你的度假屋,公寓、度假村、别墅等
2019/02/20 全球购物
测控技术自荐信
2014/06/05 职场文书
2015年圣诞节活动总结
2015/03/24 职场文书
2016高三毕业赠言寄语
2015/12/04 职场文书
pytorch 两个GPU同时训练的解决方案
2021/06/01 Python