将元素/值的选择转换为关联数组/json字符串答案

【问题标题】：Turn selection of elements/values into assoc array / json string将元素/值的选择转换为关联数组/json字符串
【发布时间】：2014-10-15 16:25:33
【问题描述】：

我需要保存/检索从网页到 PHP 到 MySQL 的一系列复选框/值，然后再返回。

在 MySQL 中，它们将存储为 JSON 字符串，如下所示：{"cb1":0,"cb2":0,"cb3":1,"cb4":0}

除了 (1) 将 checkboxes+vals 读取到一个数组中，以及 (2) 如上所示将其转换回 JSON 字符串之外，一切正常。

需要抢救的是Display JSON List (#display_all)按钮。

Here is a jsFiddle

示例 HTML：

<div id="chkbox"></div>
<input type="button" id="create_cb" value="Create Checkboxes" />
<input type="button" id="mybutt" value="Add New Checkbox" />
<input type="button" id="display_all" value="Display JSON list" />

示例 JS：

var chk, json = '{"cb1":0,"cb2":0,"cb3":1,"cb4":0}';

$('#create_cb').click(function(){
    var arrJson = JSON && JSON.parse(json) || $.parseJSON(json);
    for(key in arrJson){
        chk = (arrJson[key]==1)? 'checked="checked"' : '';
        $('#chkbox').append(key +': <input id="'+key+'" type="checkbox" '+chk+' /> ');
    }
    $(this).hide();
    $('#display_all').show();
});

$('#display_all').click(function(){
    var arrCB = $("#chkbox>input[type='checkbox']").map(function(){return this.value;});
    var text = JSON.stringify(arrCB);
    alert(text);
});

我已经查看了以下 SO 帖子，但无法弄清楚如何在我的案例中使用这些解决方案。

How can I send checkboxes data into JSON array?

JQuery: Turn array input values into a string optimization

编辑

我从this 和this 了解到，术语“关联数组”是不正确的。我真的在创建一个具有多个属性的对象。但是，使用的术语最能传达所需的字符串化结果。

【问题讨论】：

标签： jquery json

【解决方案1】：

将您的 arrCB 创建为匿名对象，然后遍历您的复选框并将其 ID 分配给 arrCB：

$('#display_all').click(function(){
    var arrCB = {};
    $("#chkbox>input[type='checkbox']").each(function(){ 
        var el = $(this);
        var id = el.attr('id');
        arrCB[id] = (this.checked ? 1 : 0)
    });
    var text = JSON.stringify(arrCB);
    alert(text);
});

小提琴：http://jsfiddle.net/k20mug9y/2/

【讨论】：