如何从 JSON 字符串中删除动态 Cookie

问题描述

在设置 cookie 后删除/移除 cookie 时遇到一些问题...

我尝试过使用“最近的 Div 删除 Cookie”、“删除附加到此 ID 的 Cookie”和其他一些内容。

我们的想法是，当用户需要从购物车中删除商品时，他们也应该删除为其设置的 cookie，以便在结账时，客户只有他们想要的商品的 cookie 数据喜欢购买...

任何帮助将不胜感激，我已经包含了下面的代码。

谢谢， 史蒂夫。

<!-- Delete Cookies Function - THIS DOES Now WORK :( -->
$('#bag_active').on('click','.remove-from-bag',function removeCookie() {
    $(this).closest('.card-slab').hide();
    $(this).closest('.hidden-cookie-title').document.getElementById("cart_product_name").value;
    $(this).closest('.hidden-cookie-price').document.getElementById("cart_product_price").value;
})


<!-- Set Cookies Function - THIS WORKS :) -->
// cookie helpers
function getCookie(name,text) {
    if (typeof text !== 'string') return null

    var nameEQ = `${name}=`
    var ca = text.split(/[;&]/)

    for (var i = 0; i < ca.length; i += 1) {
        var c = ca[i]
        while (c.charat(0) === ' ') {
        c = c.substring(1,c.length)
        }
        if (c.indexOf(nameEQ) === 0) {
        return c.substring(nameEQ.length,c.length)
        }
    }

    return null
    }

    function parseCookie(cookie) {
    try {
        return JSON.parse(cookie)
    } catch (err) {
        return null
    }
}

// set cookies
function setCookie() {
    var cookieObject = parseCookie(getCookie('cookieObject',document.cookie)) || { orders: [] }

    if (!Array.isArray(cookieObject.orders)) throw new Error('Malformed cookie!')

    var newOrder = {}
    newOrder.name = document.getElementById("cart_product_name").value
    newOrder.price = document.getElementById("cart_product_price").value
    cookieObject.orders.push(newOrder)

    var jsonString = JSON.stringify(cookieObject)

    document.cookie = "cookieObject=" + jsonString
}
window.onload = setCookie;

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<!-- Active Cart / Bag - Code Example -->
<div id="bag_active" class="row active">                    
    <div id="1" class="card card-slab">
        <h1 class="title">Cookie Title 1</h1>
        <h2 class="subtitle">Cookie Price 1</h2>
        <input type="hidden" id="cart_product_name" name="cookie_title_one" value="Cookie Title 1" class="hidden-cookie-title">
        <input type="hidden" id="cart_product_price" name="cookie_price_one" value="Cookie Price 1" class="hidden-cookie-price">
        <span><a class="btn-link btn-link-yellow remove-from-bag" onclick="removeCookie();" value="Clear Cookies">Remove from bag</a></span>
    </div>

    <div id="2" class="card card-slab">
        <h1 class="title">Cookie Title 2</h1>
        <h2 class="subtitle">Cookie Price 2</h2>
        <input type="hidden" id="cart_product_name" name="cookie_title_two" value="Cookie Title 2" class="hidden-cookie-title">
        <input type="hidden" id="cart_product_price" name="cookie_price_two" value="Cookie Price 2" class="hidden-cookie-price">
        <span><a class="btn-link btn-link-yellow remove-from-bag" onclick="removeCookie();" value="Clear Cookies">Remove from bag</a></span>
    </div>

    <div id="3" class="card card-slab">
        <h1 class="title">Cookie Title 3</h1>
        <h2 class="subtitle">Cookie Price 3</h2>
        <input type="hidden" id="cart_product_name" name="cookie_title_three" value="Cookie Title 3" class="hidden-cookie-title">
        <input type="hidden" id="cart_product_price" name="cookie_price_three" value="Cookie Price 3" class="hidden-cookie-price">
        <span><a class="btn-link btn-link-yellow remove-from-bag" onclick="removeCookie();" value="Clear Cookies">Remove from bag</a></span>
    </div>
</div>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）