Question

我正试图通过点击来设置和删除cookie。

我的HTML

<button id="listing_123" class="add-listing">Add to Itinerary</button>
<button id="listing_456" class="add-listing">Add to Itinerary</button>
<button id="listing_789" class="add-listing">Add to Itinerary</button>

我的jQuery：这让我可以很好地设置cookie（但我必须刷新页面才能查看cookie）。

jQuery(function($) {

    $('.add-itinerary').click(function() {

        var lid = $(this).attr('id');

        $.cookie('add_listing_'+ lid, 1, { expires: 30 });

        $(this).toggleClass('added');
        $(this).html($(this).text() == 'Remove' ? 'Add to Itinerary' : 'Remove');

    })

})

问题1：当页面刷新时，我失去了我的＆＃34;添加＆＃34; class和.html（）可以追溯到＆＃34; Add＆＃34; ...如何根据设置的cookie将我的课程保留在所点击的项目上。

问题2：当我第二次点击按钮时，我需要＆＃34;添加＆＃34;删除了类并删除了cookie。

非常感谢任何帮助。

Answer 1

尝试

jQuery(function ($) {

    $('.add-itinerary').click(function () {
        var lid = this.id,
            cookie = $.cookie('add_listing_' + lid);
        if (cookie == 1) {
            $.removeCookie('add_listing_' + lid)
        } else {
            $.cookie('add_listing_' + lid, 1, {
                expires: 30
            });
        }
        $(this).toggleClass('added');
        $(this).html($(this).text() == 'Remove' ? 'Add to Itinerary' : 'Remove');
    }).each(function () {
        if ($.cookie('add_listing_' + this.id) == 1) {
            $(this).addClass('added').text('Remove')
        }
    })
})

演示：Fiddle

基于多个元素的click（）设置和删除jQuery cookie

1 个答案: