jQuery 양식 제출 및 쿠키 문제 해제

Question

Shopify 고객이 장바구니에 샘플을 추가 한 경우에만 쿠키를 저장하므로 샘플을 장바구니에 한 번만 추가하는 샘플 시스템을 개발 중입니다. 항목을 선택하고 추가하면 다시 추가 할 수 없게됩니다.

그러나 전체 추가 프로세스가 사용 중지 된 것처럼 보입니다. 내가 도대체 ​​뭘 잘못하고있는 겁니까?

Live view

$('#{{ product.handle }}').submit(function(additem){ 
$(this).find(':input[type=submit]').prop('disabled', true).val('Sample Added!'); 
$.cookie('sample', '{{ product.handle }}', { 
     expires: 7 
    }); 
}); 

if ($.cookie('sample', 'balancing-treatment-sample')) { 
     $('#balancing-treatment-sample-wrap').addClass("added"); 
     $('#balancing-treatment-sample-buy').prop('disabled', true).val('Sample Added!'); 
    }else { 
     } 
if ($.cookie('sample', 'cleanser-mask-sample')) { 
     $('#cleanser-mask-sample-wrap').addClass("added"); 
     $('#cleanser-mask-sample-buy').prop('disabled', true).val('Sample Added!'); 
    }else { 
     } 

Answer 1

당신이 사용한 라이브러리는 더 lnger 이제 다음 코드는 현재 도메인의 로컬 스토리지 개체에 액세스하고 데이터 항목을 추가하는 대신

$.cookie

사용 LocalStorage을 유지하지 않습니다 그것은 Storage.setItem()을 사용합니다.

이

var cat = localStorage.getItem("myCat"); 

다음과 같이 로컬 스토리지 항목을 제거하는 구문은 다음과 같습니다 :

localStorage.removeItem("myCat"); 

을 또한, 모든 저장해야 다음과 같이

localStorage.setItem('myCat', 'Tom'); 

로컬 스토리지 항목을 읽기위한 구문은 장바구니에 항목을 추가하고 사용하지 않도록 설정하여 배열 모음이 필요하지만 localStorage은 지원하지 않으므로 JSON 문자열로 변환 할 수 있습니다. th JSON.stringify() 그리고 나서 JSON.parse() 그들을 재사용하십시오.

$('#{{ product.handle }}').on('submit', function (additem) { 
    $(this).find(':input[type=submit]').prop('disabled', true).val('Sample Added!'); 
    let CartNotEmpty = localStorage.getItem('sample') !== null; 
    let itemsCart = CartNotEmpty ? JSON.parse(localStorage.getItem('sample')) : Array(); 
    itemsCart.push('#{{ product.handle }}'); 
    localStorage.setItem('sample', JSON.stringify(itemsCart)); 
}); 


let cart = JSON.parse(localStorage.getItem('sample')); 


if ($.inArray('#balancing-treatment-sample', cart) !== -1) { 
    $('#balancing-treatment-sample-wrap').addClass("added"); 
    $('#balancing-treatment-sample-buy').prop('disabled', true).val('Sample Added!'); 
} 
if ($.inArray('#cleanser-mask-sample', cart) !== -1) { 
    $('#cleanser-mask-sample-wrap').addClass("added"); 
    $('#cleanser-mask-sample-buy').prop('disabled', true).val('Sample Added!'); 
}