javascript - Jqueryでチェックボックスを使用して単一のCookieに値を追加/削除するにはどうすればよいですか?

Question

編集:私はJSONを使用してこのソリューションでより多くの作業を行いました。ここで質問を編集する代わりに、ここで書き直してより明確にすることにしました-from-json-string-and-save-to-a-cookie

classesチェックボックスからのさまざまな値で Cookie を設定する必要があるプロジェクトがありinputます。

ここに半分動作するデモがあります http://jsfiddle.net/chFCx/7/

私がしたいこと

1. ページの読み込み時にCookiefilteredNameを読み取る必要があるため、使用できる Cookie は 1 つだけです - ポイント 4 を参照してください。
2. チェックボックスをオフにすると、入力フィールドのクラス名が Cookie に追加されます (デモではこれを行いますが、一度に 1 つの値しか保持できません)。
3. チェックボックスをオンにすると、その入力フィールドのクラス名が Cookie から削除されます。
4. ページを更新するときに、Cookie にあるチェックボックスをオフにします。

私は、クッキーが保持する何らかの Json 文字列または配列である必要があると想定しています。それが問題に遭遇し、ここでプロに尋ねる必要がある場所です。

これまでの私のJSは次のとおりですが、より多くのコンテキストについてはデモをよく見てください。

// Add or Remove Cookie On Change Function
$("input[type=checkbox]").change(function(){
    var cookieValue = $.cookie("filteredName"); // for display purposes only
    var checkedClass = $(this).attr('class');

    if ($(this).prop('checked')) {
        // if checkbox is checked remove checkedClass from cookie
        $('input[type=text].cookieValue').val(cookieValue);  // for display purposes only

    } else {
        // if checkbox is un-checked add checkedClass to cookie
        $.cookie('filteredName', checkedClass, { path: '/' });
        $('input[type=text].cookieValue').val(cookieValue);  // for display purposes only
    }
});
$('input[type=text].cookieValue').val(cookieValue);
// On Page load set checkboxes with class names in cookie to hide checkbox

// Read Cookie
// For each class name in Cookie .prop('checked' true);

編集:私はJSONを使用してこのソリューションでより多くの作業を行いました。ここで質問を編集する代わりに、ここで書き直してより明確にすることにしました-from-json-string-and-save-to-a-cookie