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内容的js代码_支持所有浏览器,修正了Firefox3.5以上的问题
Jun 21 Javascript
Script的加载方法小结
Jan 12 Javascript
三级下拉菜单的js实现代码
May 23 Javascript
推荐4个原生javascript常用的函数
Jan 12 Javascript
jQuery实现仿腾讯微博滑出效果报告每日天气的方法
May 11 Javascript
深入理解JS正则表达式---分组
Jul 18 Javascript
浅谈jQuery hover(over, out)事件函数
Dec 03 Javascript
jquery实现放大镜简洁代码(推荐)
Jun 08 jQuery
JS实现简易的图片拖拽排序实例代码
Jun 09 Javascript
浅谈实现vue2.0响应式的基本思路
Feb 13 Javascript
基于vue.js实现的分页
Mar 13 Javascript
es6中Promise 对象基本功能与用法实例分析
Feb 23 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表单处理操作
2017/11/16 PHP
很酷的javascript loading效果代码
2008/06/18 Javascript
表单类各种类型(文本框)失去焦点效果jquery代码
2013/04/26 Javascript
Jquery Ajax解析XML数据(同步及异步调用)简单实例
2014/02/12 Javascript
jquery中map函数遍历数组用法实例
2015/05/18 Javascript
QQ登录背景闪动效果附效果演示源码下载
2015/09/22 Javascript
Jquery获取第一个子元素简单实例
2016/06/02 Javascript
详解微信小程序开发之下拉刷新 上拉加载
2016/11/24 Javascript
Javascript仿京东放大镜的效果
2017/03/01 Javascript
JS关于刷新页面的相关总结
2018/05/09 Javascript
vue中导出Excel表格的实现代码
2018/10/18 Javascript
Angular Material Icon使用详解
2018/11/07 Javascript
Vue.js中 v-model 指令的修饰符详解
2018/12/03 Javascript
jQuery中使用validate插件校验表单功能
2019/05/24 jQuery
简单了解vue.js数组的常用操作
2019/06/17 Javascript
vue限制输入框只能输入8位整数和2位小数的代码
2019/11/06 Javascript
[01:04]不如跳舞!DOTA2新英雄玛尔斯的欢乐日常
2019/03/11 DOTA
Python使用matplotlib填充图形指定区域代码示例
2018/01/16 Python
python实现壁纸批量下载代码实例
2018/01/25 Python
Flask 让jsonify返回的json串支持中文显示的方法
2018/03/26 Python
Python爬虫之pandas基本安装与使用方法示例
2018/08/08 Python
更新升级python和pip版本后不生效的问题解决
2020/04/17 Python
python+django+selenium搭建简易自动化测试
2020/08/19 Python
css3 自定义字体font-face使用介绍
2014/05/14 HTML / CSS
目前不被任何主流浏览器支持的CSS3属性汇总
2014/07/21 HTML / CSS
CSS3实现图片抽屉式效果的示例代码
2019/11/06 HTML / CSS
香港彩色隐形眼镜在线商店:Stunninglens(全球免费送货)
2019/05/10 全球购物
aden + anais英国官网:美国婴儿贴身用品品牌
2019/09/08 全球购物
巴西备受欢迎的服装和生活方式品牌:FARM Rio
2020/02/04 全球购物
内部类的定义、种类以及优点
2013/10/16 面试题
大学运动会通讯稿
2014/01/28 职场文书
党校个人自我鉴定范文
2014/03/28 职场文书
民事撤诉申请书范本
2015/05/18 职场文书
导游词之无锡梅园
2019/11/28 职场文书
Python Pycharm虚拟下百度飞浆PaddleX安装报错问题及处理方法(亲测100%有效)
2021/05/24 Python
nginx访问报403错误的几种情况详解
2022/07/23 Servers