javascript - 如何检查一个项目是否存在于动态数组中?
问题描述
我想将项目添加到 cartArray。如果 Array 已经有一个 item ,我将编写一个函数,通过增加它的数量来防止它再次添加它。这怎么可能。数组项具有多个元素(例如,id、价格、数量)。
$(document).ready(function(){
var cartArray = []; //array of cart Items data
var total = 0;
var shipping = 2;
$(".addToCart").click(function(){
var flag = 0;
//Get all data of item to be added
var id= $(this).data("id");
var price= $(this).data("price");
var image = $(this).data('image');
var name = $(this).data("name");
var quantity = $(this).data("quantity");
var availability = $(this).data("availability");
var weight = $(this).data("weight");
//check if cart is empty to remove empty cart view
if( (cartArray.length === 0) ) {
$("#empty-cart").css("display","none");}
//Traverse the cart list to check if item already exists or not
for(var i = 0; i < cartArray.length; ++i){
if (//what to do here to match id){
var increment= $( this ).find(".quantity").val();
increment++;
flag = 1;
$( this ).find(".quantity").val(increment);
return false;
}
}
//Add new Item in cart
if(flag == 0){
var cartItem = "<li class='newItem'><p class='id'>"+id+"</p><div class='picture'><img src='"+image+"' ></div> <div class='details'><p class='name'>"+name+"</p><span class='weight'>"+weight+"</span><span> /</span> <span class='avail'>"+availability+"</span><p class='price'>"+price+"</p><a type='button' class='inc'>+</a><input type='text' class='quantity' value="+quantity+" ><a type='button' class='dec'>-</a></div> <a type='button' class='removeItem'><i class='fa fa-trash'></i></a></li>"
cartArray.push(cartItem);
localStorage.setItem('cartItem',JSON.stringify(cartArray));
var getItems = JSON.parse(localStorage.getItem('cartItem'));
// $("#cartList").prepend(cartItem);
$("#cartList li .id").css('display','none');
console.log("Item Added")
//increment in badge icon number when new item added in cart
var counterInc = parseInt($(".badge").html()) + 1;
$(".badge").html(counterInc);
}
})
解决方案
编辑
在亚历山大发表评论后,您必须修改解决方案
function isInCart(id){
var items = JSON.parse(localStorage.getItem('actualCart'));
return !!items.filter(i=>i.id == id).length;
}
$(document).ready(function(){
var actualCartArray = []; //array of cart Items data
var cartArray = []; //array of cart Items html
var total = 0;
var shipping = 2;
$(".addToCart").click(function(){
if(isInCart($(this).data("id"))){
return;
}
var flag = 0;
//Get all data of item to be added
var id= $(this).data("id");
var price= $(this).data("price");
var image = $(this).data('image');
var name = $(this).data("name");
var quantity = $(this).data("quantity");
var availability = $(this).data("availability");
var weight = $(this).data("weight");
actualCartArray.push({id,price,image,name,quantity,availability,weight});
//check if cart is empty to remove empty cart view
if( (cartArray.length === 0) ) {
$("#empty-cart").css("display","none");}
//Traverse the cart list to check if item already exists or not
for(var i = 0; i < cartArray.length; ++i){
if (//what to do here to match id){
var increment= $( this ).find(".quantity").val();
increment++;
flag = 1;
$( this ).find(".quantity").val(increment);
return false;
}
}
//Add new Item in cart
if(flag == 0){
var cartItem = "<li class='newItem'><p class='id'>"+id+"</p><div class='picture'><img src='"+image+"' ></div> <div class='details'><p class='name'>"+name+"</p><span class='weight'>"+weight+"</span><span> /</span> <span class='avail'>"+availability+"</span><p class='price'>"+price+"</p><a type='button' class='inc'>+</a><input type='text' class='quantity' value="+quantity+" ><a type='button' class='dec'>-</a></div> <a type='button' class='removeItem'><i class='fa fa-trash'></i></a></li>"
cartArray.push(cartItem);
localStorage.setItem('cartItem',JSON.stringify(cartArray));
localStorage.setItem('actualCart',JSON.stringify(actualCartArray));
var getItems = JSON.parse(localStorage.getItem('cartItem'));
// $("#cartList").prepend(cartItem);
$("#cartList li .id").css('display','none');
console.log("Item Added")
//increment in badge icon number when new item added in cart
var counterInc = parseInt($(".badge").html()) + 1;
$(".badge").html(counterInc);
}
})
创建并使用如下函数。如果项目在 localStorage 购物车中,则传递一个 id 并返回布尔值。
function isInCart(id){
var items = JSON.parse(localStorage.getItem('cartItem'));
return !!items.filter(i=>i.id == id).length;
}
推荐阅读
- django - 使用 Django-jet 在管理员的 change_list 视图中显示布尔字段时显示图标
- ios - 如何在 iOS13 中删除 NavigationBar 边框/分隔符?
- .net - 如何在 Linux 上的 .NET Core 3 项目中使用 Mono 库?
- sql - 我想按客户获取销售额并以不同的付款方式分组
- vba - 如何在访问表单中显示消息框以响应 if-then
- parsing - 读取带有错误 Prelude.read: no parse 的自定义数据类型
- python - 使用 python mysql 连接器出现位置错误
- python - 为 4 列中的相同条目应用相同的颜色分散 matplotlib python
- javascript - PyMongo 匹配 JavaScript 正则表达式对象
- scala - java.sql.SQLException: Io 异常: NL 异常产生