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

时间:2015-02-12 07:40:50

标签: javascript jquery json

我有一个复选框,每个复选框的值都是这样的:“case-color-id”

e.g。

  1. 情形1 - 红 - 1
  2. 情形2 - 蓝 - 2
  3. 情形1 - 蓝 - 4
  4. 情形3 - 绿 - 3
  5. 我要做的是用这些值创建一个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));
    
    }
    

2 个答案:

答案 0 :(得分:2)

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);

See working DEMO.

答案 1 :(得分:0)

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

    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>