Javascript 如何使用复选框获取多个JSON数组的值？

HTML和JS

在这段代码中，如果我一次选中一次2复选框，意味着我只得到第一个JSON值的输出。。。 如果我取消选中一个，意味着我得到了它各自的值。。。 我的意思是，例如，如果我从一个类别中选择女性，那么我会得到两个复选框，1.个人护理用具和2.珠宝。 如果我一次选中多个复选框，则意味着我只获得了吹风机个人护理用品的价值，而没有获得人造珠宝首饰的价值 如果我一次选择一个意味着我得到了合适的结果，请帮我解决这个错误。。。

---

我被困在这里。

您在for循环中犯了几个错误，请检查更新的代码片段

这里的var j=0；j 此处var checkedValue=$”。catcbs:checked'.mapfunction{ 返回$this.val； }.得到；，这里您只得到一个值，更新它以获得数组中的值

请过目一下，如果你有任何困惑，请告诉我

常数jsonData= [ { 身份证号码：47， 姓名：女性， 家长：0， 状态：已启用， 物品计数：44， 兄弟姐妹：[ { id:87， 名称：个人护理用品， 家长：47， 状态：已启用， 物品计数：2， 兄弟姐妹：[ { id:88， 名称：吹风机， 家长：87， 状态：已启用， 物品计数：2， 兄弟姐妹：[ ] } ] }, { id:127， 姓名：Jewellary， 家长：47， 状态：已启用， 物品计数：41， 兄弟姐妹：[ { 身份证号码：128， 名称：人造珠宝， 家长：127， 状态：已启用， 物品计数：41， 兄弟姐妹：[ ] } ] } ] } ]; 函数getallcategory{ var-link=jsonData； 对于变量i=0；i`； } } } } } $'selected-item'.htmlselectedItem } getallcategory； 选择类别&emsp； 点击下一步！

---

您在for循环中犯了几个错误，请检查更新的代码段

这里的var j=0；j 此处var checkedValue=$”。catcbs:checked'.mapfunction{ 返回$this.val； }.得到；，这里您只得到一个值，更新它以获得数组中的值

请过目一下，如果你有任何困惑，请告诉我

常数jsonData= [ { 身份证号码：47， 姓名：女性， 家长：0， 状态：已启用， 物品计数：44， 兄弟姐妹：[ { id:87， 名称：个人护理用品， 家长：47， 状态：已启用， 物品计数：2， 兄弟姐妹：[ { id:88， 名称：吹风机， 家长：87， 状态：已启用， 物品计数：2， 兄弟姐妹：[ ] } ] }, { id:127， 姓名：Jewellary， 家长：47， 状态：已启用， 物品计数：41， 兄弟姐妹：[ { 身份证号码：128， 名称：人造珠宝， 家长：127， 状态：已启用， 物品计数：41， 兄弟姐妹：[ ] } ] } ] } ]; 函数getallcategory{ var-link=jsonData； 对于变量i=0；i`； } } } } } $'selected-item'.htmlselectedItem } getallcategory； 选择类别&emsp； 点击下一步！

---

您可以为这个示例创建一个JSFIDLE，这样对调试很有帮助。亲爱的先生，这里是JSFIDLE链接。。。在这个链接中，我的程序在那里。。。有这么多种类，像男人，女人，家庭家具，电子产品。。。在那个JSON中，我只给女人数组。。。在这种情况下，如果我从select option means中选择女性，1.个人护理设备和珠宝会显示在复选框中，如果我同时选择多个个人护理设备和珠宝，则其仅显示第一个阵列的个人护理设备值吹风机。如果我取消选中任何一个并单击按钮，则表示我得到了正确的结果。但不是在multiplebro上验证小提琴和共享，它不起作用，兄弟，先生。。。我只是说。。。我需要男人，女人，电子产品等的列表，在选择选项。。。在这个Json中，我只给出了一个Json数组。。。单一的选择对我来说也足够了。。。我会在这里修改代码。。。如果我选择女性，意味着我应该选择个人护理用品和珠宝作为复选框。。如果我一次选中多个复选框，意味着我应该从喀拉拉邦的控制台中获取Json数组中的所有值。如果您能为这个示例创建一个JSFIDLE，那么它将有助于调试，请检查答案。亲爱的先生，这里是JSFIDLE链接。。。在这个链接中，我的程序在那里。。。有这么多种类，像男人，女人，家庭家具，电子产品。。。在那个JSON中，我只给女人数组。。。在这种情况下，如果我从select option means中选择女性，1.个人护理设备和珠宝会显示在复选框中，如果我同时选择多个个人护理设备和珠宝，则其仅显示第一个阵列的个人护理设备值吹风机。如果我取消选中任何一个并单击按钮，则表示我得到了正确的结果。但不是在multiplebro上验证小提琴和共享，它不起作用，兄弟，先生。。。我只是说。。。我需要男人，女人，电子产品等的列表，在选择选项。。。在这个Json中，我只给出了一个Json数组。。。单一的选择对我来说也足够了。。。我会在这里修改代码。。。如果我选择女性，意味着我应该选择个人护理用品和珠宝作为复选框。。如果我一次选中多个复选框，意味着我应该从喀拉拉邦的控制台中获取Json数组中的所有值。请核对答案。。。Mangalapurian。。。卡纳塔克邦和喀拉拉邦的边界…@ManojHM great bro，我来自喀拉拉邦。希望你能得到答案，别忘了接受答案，并投赞成票。继续为Anks Etta编写代码。。。现在权力已经消失了。。。一旦通电就会检查代码。。。然后我会再打你一次。。。谢谢你，埃顿…事实上。。。Mangalapurian。。。卡纳塔克邦和喀拉拉邦的边界…@ManojHM great bro，我来自喀拉拉邦。希望你能得到答案，别忘了接受答案，并投赞成票。继续为Anks Etta编写代码。。。现在权力已经消失了。。。一旦通电就会检查代码。。。然后我会再打你一次。。。谢谢你，埃顿。。。

<div class="form-group form-inline text-center">
  <label for="select_category">Select Category</label>&emsp;
  <select class="custom-select" id="select_category" style="width: 500px;" onchange="listcatcb();">
    <option selected></option>
  </select>
</div>
<div class="container" id="cats">
  <div class="form-check" id="catrbs"> </div>
  <button class="btn btn-outline-secondary" onclick="nextcats();">Click Next!</button>
</div>

getallcategory();

function getallcategory() {
  var link = 'allcat.json';
  $.post(link).done(function (data) {
    data2 = JSON.stringify(data);
    var obj = jQuery.parseJSON(data2);
    for (var i = 0; i < obj.length; i++) {
      $("#select_category").append('<option value="' + obj[i].name + '">' + obj[i].name + '</option> ')
    }
  });
}

function listcatcb() {
  selcat = document.getElementById("select_category").value;
  var link = 'allcat.json';
  $.post(link).done(function (data) {
    data2 = JSON.stringify(data);
    var obj = jQuery.parseJSON(data2);
    for (var i = 0; i < obj.length; i++) {
      if (obj[i].name == selcat) {
        for (var j = 0; j < obj.length; j++) {
          $("#catrbs").append('<input class="form-check-input catcbs" type="checkbox" id="' + obj[i].siblings[
              j].name + '" value="' + obj[i].siblings[j].name + '"><label class="form-check-label" for="' +
            obj[i].siblings[j].name + '">' +
            obj[i].siblings[j].name +
            '</label><br/>')
        }
      }
    }

  });
}

function nextcats() {
  var link = 'allcat.json';
  var checkedValue = $('.catcbs:checked').val();;
  $.post(link).done(function (data) {
    data2 = JSON.stringify(data);
    var obj = jQuery.parseJSON(data2);

    for (var i = 0; i < obj.length; i++) {
      if (obj[i].name == selcat) {
        for (var j = 0; j < obj.length; j++) {

          if (obj[i].siblings[j].name == checkedValue) {
            for (var k = 0; k < obj.length; k++) {
              console.log(obj[i].siblings[j].siblings[k].name);
            }
          }
        }
      }
    }
  });
}

[ { "id"       : "47"
  , "name"     : "Women"
  , "parent"   : "0"
  , "status"   : "Enabled"
  , "itemcount": 44
  , "siblings": 
    [ { "id"       : "87"
      , "name"     : "Personal Care Appliances"
      , "parent"   : "47"
      , "status"   : "Enabled"
      , "itemcount": 2
      , "siblings": 
        [ { "id"       : "88"
          , "name"     : "Hair Dryers"
          , "parent"   : "87"
          , "status"   : "Enabled"
          , "itemcount": 2
          , "siblings" : [] 
      } ] } 
    , { "id"       : "127"
      , "name"     : "Jewellary"
      , "parent"   : "47"
      , "status"   : "Enabled"
      , "itemcount": 41
      , "siblings": 
        [ { "id"       : "128"
          , "name"     : "Artificial Jewellary"
          , "parent"   : "127"
          , "status"   : "Enabled"
          , "itemcount": 41
          , "siblings" : [] 
} ] } ] } ]