zoukankan html css js c++ java

用$.cookie()来存历史浏览记录，并且显示出来

前提：要引入cookie.js和jquery.js文件

1、创建cookie

 1 function CreateCookikeHistory() {
 2             var canAdd = true;
 3             var ck = $.cookie(COOKIE_NAME1);
 4             if ($.cookie(COOKIE_NAME1) == null) {
 5                 //商品详细信息
 6                 var jsonStr = "[{'ProductName':'" + $("#txtname").val() + "','PicMiddleUrl':'" + $("#txtimg").val() + "','SalePrice':'" + $("#txtprice").val() + "','ItemCode':'" + $("#txtcode").val() +"','ProductCode':'" + $("#txtpcode").val()+ "'}]";
 7                 $.cookie(COOKIE_NAME1, jsonStr, cookieSet); //如果没有这个cookie就设置他
 8             }
 9             else {
10                 var jsonObj = eval('(' + $.cookie(COOKIE_NAME1) + ')'); //如果有，把json字符串转换成对象
11 
12                 //循环判断是否已经存在该产品
13                     for (var obj in jsonObj) {
14                         if (jsonObj[obj].ProductCode.toString() == $("#txtpcode").val().toString()) {  
15                             canAdd = false;
16                             return false;
17                         }
18                      }
19                      if(canAdd){
20                         jsonObj[jsonObj.length] = new Object();
21                         jsonObj[jsonObj.length - 1].ProductName = $("#txtname").val();
22                         jsonObj[jsonObj.length - 1].PicMiddleUrl = $("#txtimg").val();
23                         jsonObj[jsonObj.length - 1].SalePrice = $("#txtprice").val();
24                         jsonObj[jsonObj.length - 1].ItemCode = $("#txtcode").val();
25                         jsonObj[jsonObj.length - 1].ProductCode = $("#txtpcode").val();
26                         $.cookie(COOKIE_NAME1, JSON.stringify(jsonObj), cookieSet1);  //写入coockie   JSON需要json2.js支持
27                     }
28             }
29         }

one

2、读取并显示cookie里面的数据

 1 function getHistoryProduct() {
 2             if ($.cookie(COOKIE_NAME1) != null) {
 3                 var json = eval('(' + $.cookie(COOKIE_NAME1) + ')');
 4                 var str = "";
 5                 str += "<div class='w152 fl' style='margin-top:15px'><img src='/images/icon-lishi(1).jpg'/></div>";
 6                 str += "<div class='w152 fl'>";
 7                 for (var i = json.length; i > 0; i--) {
 8                     str += "<div class='w152 fl mt10'><a  href='/product/" + json[i - 1].ProductCode + ".html' target='_blank' title='" + json[i - 1].ProductName + "'><img src='" + json[i - 1].PicMiddleUrl + "' width='152' height='152' alt='" + json[i - 1].ProductName + "'/></a></div>";
 9                     str += "<div class='w152 fl fwb tac mt10'>" + json[i-1].ProductName + "</div>";
10                     str += "<div class='w152 fl mt10 tac tjjg'>" + json[i-1].ItemCode + "·" + json[i-1].SalePrice + "</div>";
11                     if (json.length-i>=4) {
12                         i = 0;
13                     }
14                 }
15                 str += "</div>";
16                 $("#reProduct").append(str);
17             }
18         }

two

function CreateCookikeHistory() {
var canAdd = true;
var ck = $.cookie(COOKIE_NAME1);
if ($.cookie(COOKIE_NAME1) == null) {
//商品详细信息
var jsonStr = "[{'ProductName':'" + $("#txtname").val() + "','PicMiddleUrl':'" + $("#txtimg").val() + "','SalePrice':'" + $("#txtprice").val() + "','ItemCode':'" + $("#txtcode").val() +"','ProductCode':'" + $("#txtpcode").val()+ "'}]";
$.cookie(COOKIE_NAME1, jsonStr, cookieSet); //如果没有这个cookie就设置他
}
else {
var jsonObj = eval('(' + $.cookie(COOKIE_NAME1) + ')'); //如果有，把json字符串转换成对象

//循环判断是否已经存在该产品
for (var obj in jsonObj) {
if (jsonObj[obj].ProductCode.toString() == $("#txtpcode").val().toString()) {
canAdd = false;
return false;
}
}
if(canAdd){
jsonObj[jsonObj.length] = new Object();
jsonObj[jsonObj.length - 1].ProductName = $("#txtname").val();
jsonObj[jsonObj.length - 1].PicMiddleUrl = $("#txtimg").val();
jsonObj[jsonObj.length - 1].SalePrice = $("#txtprice").val();
jsonObj[jsonObj.length - 1].ItemCode = $("#txtcode").val();
jsonObj[jsonObj.length - 1].ProductCode = $("#txtpcode").val();
$.cookie(COOKIE_NAME1, JSON.stringify(jsonObj), cookieSet1); //写入coockie JSON需要json2.js支持
}
}
}

function getHistoryProduct() {
if ($.cookie(COOKIE_NAME1) != null) {
var json = eval('(' + $.cookie(COOKIE_NAME1) + ')');
var str = "";
str += "<div class='w152 fl' style='margin-top:15px'><img src='/images/icon-lishi(1).jpg'/></div>";
str += "<div class='w152 fl'>";

// for (var obj in json) {
// str += "<div class='w152 fl mt10'><a href='/product/" + json[obj].ProductCode + ".html' target='_blank'><img src='" + json[obj].PicMiddleUrl + "' width='152' height='152' alt='" + json[obj].ProductName + "'/></a></div>";
// str += "<div class='w152 fl fwb tac mt10'>" + json[obj].ProductName + "</div>";
// str += "<div class='w152 fl mt10 tac tjjg'>" + json[obj].ItemCode + "·" + json[obj].SalePrice + "</div>";
// }
// for (var i = 0; i < json.length; i++) {
// str += "<div class='w152 fl mt10'><a href='/product/" + json[i].ProductCode + ".html' target='_blank'><img src='" + json[i].PicMiddleUrl + "' width='152' height='152' alt='" + json[i].ProductName + "'/></a></div>";
// str += "<div class='w152 fl fwb tac mt10'>" + json[i].ProductName + "</div>";
// str += "<div class='w152 fl mt10 tac tjjg'>" + json[i].ItemCode + "·" + json[i].SalePrice + "</div>";
// if (i >= 4) {
// i = json.length;
// }
// }

for (var i = json.length; i > 0; i--) {
str += "<div class='w152 fl mt10'><a href='/product/" + json[i - 1].ProductCode + ".html' target='_blank' title='" + json[i - 1].ProductName + "'><img src='" + json[i - 1].PicMiddleUrl + "' width='152' height='152' alt='" + json[i - 1].ProductName + "'/></a></div>";
str += "<div class='w152 fl fwb tac mt10'>" + json[i-1].ProductName + "</div>";
str += "<div class='w152 fl mt10 tac tjjg'>" + json[i-1].ItemCode + "·" + json[i-1].SalePrice + "</div>";
if (json.length-i>=4) {
i = 0;
}
}
str += "</div>";
$("#reProduct").append(str);
}
}

查看全文

相关阅读:
js浏览器对象
 js对象
 js基础
 css的常见操作
 css 盒子模型
 css定位与浮动
 汇编三(习题)
pyEcharts安装及使用指南(最新)
pyEcharts安装及使用指南
 Anaconda安装第三方库与pip和conda 添加国内源

原文地址：https://www.cnblogs.com/angelgril/p/3120729.html