Javascript 从复选框创建具有复杂变量的对象

我有一个复选框，每个复选框都有这样的值：“case color id”

e、 g

案例1-红色-1

案例2-蓝色-2

案例1-蓝色-4

案例3-绿色-3

我想做的是用这些值创建一个json。最终的结果是：

cases:[
    {
      case1:[
             {
               id : '1'
               color: 'red'
             },
             {
               id: '4'
               color: 'blue'
             }
            ],
      case2:[
             {
               id : '2'
               color: 'blue'
             }
            ],
      case3:[
             {
               id : '3'
               color: 'green'
             }
            ]       
       }
      ]     

我需要关于使用jquery/javascript插入对象的逻辑的帮助

$('#checkbox :checkbox:checked').each(function (index, element) {

        var case = $('this').val().split('-')[0];
        var color = $('this').val().split('-')[1];
        var id = $('this').val().split('-')[2];

   var caseHolderObject = new Object();

   // create objects here and insert the values depending which case it belongs to

   // Then get the jsonString
   var jsonString = JSON.stringify(caseHolderObject));

}

---

检查此脚本我在其中尝试了您的大部分需求，如果您需要更新，请告诉我：

    function retriever(){
var caseObject = new Object();
$(':checkbox:checked').each(function () {

   var caseHolderObject = new Object();
   var caseVal = $(this).val().split('-')[0];
    var color = $(this).val().split('-')[1];
    var id = $(this).val().split('-')[2];
caseHolderObject['color']=color;
caseHolderObject['id']=id;
    caseObject[caseVal]=caseHolderObject;
});

   var jsonString = JSON.stringify(caseObject);
    alert(jsonString);
}


HTML :
<input type="checkbox" value="case1-red-1">
<input type="checkbox" name="case1" value="case2-red-2">
<input type="checkbox" name="case2" value="case4-red-4">
<input type="checkbox" name="case3" value="case3-red-3">
<button onclick="retriever()">here</button>

函数检索器（）{
var caseObject=新对象（）；
$（'：复选框：选中'）。每个（函数（）{
var caseHolderObject=新对象（）；
var caseVal=$（this.val（）.split（'-'）[0]；
var color=$（this.val（）.split（'-'）[1]；
var id=$（this.val（）.split（'-'）[2]；
caseHolderObject['color']=颜色；
caseHolderObject['id']=id；
caseObject[caseVal]=caseHolderObject；
});
var jsonString=JSON.stringify（caseObject）；
警报（jsonString）；
}
HTML:
在这里

---

仅供参考，没有“JSON对象”，它们只是简单的旧对象，更新了问题。请随时将您的代码添加到答案中，并添加可单击的链接。如果你的小提琴不起作用，你的答案就没用了

var cases = [{}];
$('#checkbox :checkbox:checked').each(function (index, element) {
    var cas = $(this).val().split('-')[0];
    var color = $(this).val().split('-')[1];
    var id = $(this).val().split('-')[2];
    var obj = {
        id: id,
        color: color
    };
    var ary = [obj];
    if (cases[0][cas]) {
        cases[0][cas].push(obj);
    } else {
        cases[0][cas] = ary;
    }
});
var jsonString = JSON.stringify(cases);