我创建了一个“收藏夹”按钮,因此按下该按钮可捕获产品的图像,URL,标题并将图像,URL和标题存储到localStorage中,我通过遍历localStorage内部的所有键并仅使用键来访问本地存储其中包含我为捕获而创建的密钥的一部分,我的问题是.append()html内容时,所以我使用密钥的值有时会从错误的产品中选择错误的链接我该怎么做,所以它是异步的从设置键时开始加载键?
帐户页面
for (var key in localStorage){
if(key.includes("productURL")){
var productURL = localStorage.getItem(key);
}
if(key.includes("productImage")){
var productImage = localStorage.getItem(key);
}
if(key.includes("productTitle-")){
var productTitle = localStorage.getItem(key);
console.log(productTitle);
$(".favouriteProducts").append("<div class=col-md-2><a href="+productURL+"><h2>"+productTitle+ "</h2><div class=thumbnail><img src="+productImage+"</div></a></div>");
}
}
产品页面
function addProductToLocalStorage(){
var thisProductJSON = {{ product | json }};
var productTitle = {{ product.title | prepend: '"'| append: '"'}};
var productURL = {{ product.url | prepend: '"' | append: '"'}};
var productImage = "{{ product.featured_image.src | img_url }}";
var clickCheck = 0;
$( "a#fav" ).click(function(e) {
e.preventDefault();
clickCheck++;
console.log(clickCheck)
var addProductTitle = localStorage.setItem("productTitle-"+productTitle,productTitle);
var addProductURL = localStorage.setItem("productURL-"+productURL,productURL);
var addProductImage = localStorage.setItem("productImage-"+productImage,productImage);
var getProductTitle = localStorage.getItem("productTitle-"+clickCheck);
var getProductURL = localStorage.getItem("productURL-"+clickCheck);
var getProductImage = localStorage.getItem("productImage-"+clickCheck);
if(clickCheck = clickCheck + 1){
$(this).unbind("click");
removeFavouriteFromLocalStorage(clickCheck);
}
});
}
function removeFavouriteFromLocalStorage(clickCheck){
console.log(clickCheck);
var thisProductJSON = {{ product | json }};
var productImage {{ product.images | prepend: '"' | append: ''| img_url }};
var productTitle = {{ product.title | prepend: '"'| append: '"'}};
var productURL = {{ product.url | prepend: '"' | append: '"'}};
$( "a#fav" ).click(function() {
var removeProductImage = localStorage.removeItem("productImage-"+clickCheck);
var RemoveProductTitle = localStorage.removeItem("productTitle-"+clickCheck);
var removeProductURL = localStorage.removeItem("productURL-"+clickCheck);
$(this).removeclass('favourited');
clickCheck++;
if(clickCheck =+ 1){
$(this).unbind("click");
console.log(clickCheck);
addProductToLocalStorage(clickCheck);
}
});
}
addProductToLocalStorage();