如何通过javascript从父类别中获取每个子类别？

Question

当我通过JQuery选择父类别时，我想列出子类别。 当我点击父类别时，我只获得子类别的最后一项。

如何让所有项目都属于该父项？

function update_subscategories_div(parent_id) { 
   var result={},objectlength
  jQuery.ajax({
    url: "/get_subscategories/"+parent_id+".json",
    type: "GET",
    data: {"parent_id" : parent_id},
    dataType: "html",
    success: function(data) {
      result = JSON.parse(data)
      objectlength =result.length
      for(var i=0; i<objectlength; i++)
      {
        var name = jQuery("#categoriesDiv").html(result[i].name);
      }
      console.log(name);
      console.log(objectlength);
    }
  });
}

表

Answer 1

您可以拥有一个全局数组，并在for循环中将每个子类别添加到该数组，并在结尾处返回该数组。

    var subcat = [];//Array of subcategories
    for (var i = 0; i < objectlength; i++) {
        subcat.push(result[i].name);

}

同样现在你可以按照上面的方式循环子数组。

Answer 2

jQuery("#categoriesDiv").html(result[i].name);

将其替换为下面一个。

jQuery("#categoriesDiv").append('<option>'+result[i].name+'</option>');

我认为 categoriesDiv 此ID应该是选择框。 例如：

<select id="categoriesDiv">
    </select>

并在for循环之前添加此功能 jQuery（＆＃34;＃selectprarentId＆＃34;）。find（＆＃39; option＆＃39;）。remove（）;

然后它会起作用。

Answer 3

你的问题在这里

 for(var i=0; i<objectlength; i++)
 {
      var name = jQuery("#categoriesDiv").html(result[i].name);
 }

您在每次迭代中重新定义name的值。这就是你获得子类别中最后一个值的原因。

将您的代码更改为

var name = "";
var categoriesDiv = jQuery("#categoriesDiv");
for(var i=0; i<objectlength; i++){
    var currentText = categoriesDiv .html();
    var newText = currentText+' '+ result[i].name;
    categoriesDiv .html(newText );
    name += ' ' + result[i].name; // this may not be necessary
}
console.log(categoryArray);
console.log(objectlength);

Answer 4

function update_subscategories_div(parent_id) { 
   var result={},objectlength;
  jQuery.ajax({
    url: "/get_subscategories/"+parent_id+".json",
    type: "GET",
    data: {"parent_id" : parent_id},
    dataType: "html",
    success: function(data) {
     jQuery("#categoriesDiv").find('option').remove();
      result = JSON.parse(data);
      objectlength =result.length;
      for(var i=0; i<objectlength; i++)
      {
        jQuery("#categoriesDiv").append('<option>'+result[i].name+'</option>');
      }
      console.log(name);
      console.log(objectlength);
    }
  });
}