0

我正在尝试调整我们用来存储是否选中复选框的一些代码，以便在页面刷新时记住哪些复选框被选中或未选中。问题是我要存储的新元素现在不是复选框，它基本上是一个图标，它有一个打开或关闭类（'selected'）的图标，并在它旁边放置一个复选标记。这是切换功能：

//share - add class and check on click
$('.share-actions li a').click(function(e) {
    e.preventDefault();
    $(this).toggleClass('selected');
});

这是我正在尝试调整的 cookie：

var $checkboxes;

// set the cookie
function setcookie() {
    var options= $checkboxes.map(function() {
        if (this.checked) return this.name;
    }).get().join(',');

    $.cookie('new_cookie', options);
}

$(function() {
    $checkboxes = $('input:checkbox').change(setcookie);
});

var alreadySetCookies = $.cookie('new_cookie').split(',');

for (var $cookie in alreadySetCookies) {
    $("input[name='" + alreadySetCookies[$cookie] + "']").attr("checked", "checked");
}
4

1 回答 1

0

检测selected类的存在而不是检查状态。对原始代码的改动很小。

事件处理程序：

$('.share-actions li a').click(function(e) {
    e.preventDefault();

    $(this).toggleClass('selected');
    setcookie();
});

以及一般的 cookie 获取/设置代码：

var $checkboxes = $('.share-actions li a');

function setcookie() {
    var options = $checkboxes.map(function() {
        if ($(this).hasClass('selected')) return $(this).attr('id');
    }).get().join(',');

    $.cookie('new_cookie', options);
}

var alreadySetCookies = $.cookie('new_cookie').split(',');

alreadySetCookies.forEach(function(id) {
    $("#" + id).addClass('selected');
});

每个“复选框”都需要一个唯一的 ID 才能工作：

<ul class="share-actions">
    <li><a href="#" id="facebook">Facebook</a></li>
    <li><a href="#" id="twitter">Twitter</a></li>
    <li><a href="#" id="instagram">Instagram</a></li>
</ul>
于 2013-10-29T00:27:12.523 回答