使用JSON多维数组填充嵌套复选框中的值

// 假设有一个JSON多维数组
var data = [
  {
    "id": 1,
    "name": "Category 1",
    "children": [
      {
        "id": 11,
        "name": "Subcategory 1.1"
      },
      {
        "id": 12,
        "name": "Subcategory 1.2"
      }
    ]
  },
  {
    "id": 2,
    "name": "Category 2",
    "children": [
      {
        "id": 21,
        "name": "Subcategory 2.1"
      },
      {
        "id": 22,
        "name": "Subcategory 2.2"
      }
    ]
  }
];

// 递归函数用于生成嵌套复选框
function generateCheckbox(data, parentElement) {
  for (var i = 0; i < data.length; i++) {
    var item = data[i];
    
    // 创建复选框元素
    var checkbox = document.createElement("input");
    checkbox.type = "checkbox";
    checkbox.value = item.id;
    parentElement.appendChild(checkbox);
    
    // 创建标签元素
    var label = document.createElement("label");
    label.innerHTML = item.name;
    parentElement.appendChild(label);
    
    // 如果有子项，则递归生成子复选框
    if (item.children && item.children.length > 0) {
      var subContainer = document.createElement("div");
      parentElement.appendChild(subContainer);
      generateCheckbox(item.children, subContainer);
    }
  }
}

// 找到要填充的容器元素
var container = document.getElementById("checkboxContainer");

// 调用递归函数生成嵌套复选框
generateCheckbox(data, container);