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 相关文章推荐
input禁止键盘及中文输入,但可以点击
Feb 13 Javascript
JavaScript获取页面上被选中文字的方法技巧
Mar 13 Javascript
Node.js读写文件之批量替换图片的实现方法
Sep 07 Javascript
详解基于angular路由的requireJs按需加载js
Jan 20 Javascript
详解javascript立即执行函数表达式IIFE
Feb 13 Javascript
JS中使用正则表达式g模式和非g模式的区别
Apr 01 Javascript
Angular.JS中select下拉框设置value的方法
Jun 20 Javascript
vue实现样式之间的切换及vue动态样式的实现方法
Dec 19 Javascript
使用pkg打包Node.js应用的方法步骤
Oct 19 Javascript
vue component 中引入less文件报错 Module build failed
Apr 17 Javascript
在Vue中使用this.$store或者是$route一直报错的解决
Nov 08 Javascript
vue中如何添加百度统计代码
Dec 19 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
phpmyadmin 常用选项设置详解版
2010/03/07 PHP
PHP处理JSON字符串key缺少双引号的解决方法
2014/09/16 PHP
php使用date和strtotime函数输出指定日期的方法
2014/11/14 PHP
PHP常见错误提示含义解释(实用!值得收藏)
2016/04/25 PHP
php实现转换html格式为文本格式的方法
2016/05/16 PHP
php 基础函数
2017/02/10 PHP
php实现的错误处理封装类实例
2017/06/20 PHP
form自动提交实例讲解
2017/07/10 PHP
js 内存释放问题
2010/04/25 Javascript
JS验证控制输入中英文字节长度(input、textarea等)具体实例
2013/06/21 Javascript
JS中引用百度地图并将百度地图的logo和信息去掉
2013/09/29 Javascript
jQuery列表拖动排列具体实现
2013/11/04 Javascript
JavaScript 实现鼠标拖动元素实例代码
2014/02/24 Javascript
node.js中的fs.fstat方法使用说明
2014/12/15 Javascript
深入学习JavaScript中的Rest参数和参数默认值
2015/07/28 Javascript
微信JSSDK上传图片
2015/08/23 Javascript
JS实现仿Windows7风格的网页右键菜单效果代码
2015/09/11 Javascript
javascript中利用柯里化函数实现bind方法
2016/04/29 Javascript
JS+Canvas 实现下雨下雪效果
2016/05/18 Javascript
Vue.js原理分析之observer模块详解
2017/02/17 Javascript
微信小程序图片横向左右滑动案例
2017/05/19 Javascript
详解vue-cli项目中怎么使用mock数据
2018/05/29 Javascript
webpack之引入图片的实现及问题
2018/10/08 Javascript
[00:38]TI珍贵瞬间系列(二):笑
2020/08/26 DOTA
一些Python中的二维数组的操作方法
2015/05/02 Python
对python实现模板生成脚本的方法详解
2019/01/30 Python
使用Python测试Ping主机IP和某端口是否开放的实例
2019/12/17 Python
Python基于gevent实现文件字符串查找器
2020/08/11 Python
解决python 执行shell命令无法获取返回值的问题
2020/12/05 Python
德国运动营养和健身网上商店:Myprotein.de
2018/07/18 全球购物
几个人围成一圈的问题
2013/09/26 面试题
保护环境建议书300字
2014/05/13 职场文书
网站推广策划方案
2014/06/04 职场文书
优秀班主任材料
2014/12/16 职场文书
慰问信模板
2015/02/14 职场文书
合理化建议书范文
2015/09/14 职场文书