JQUERY：使用json文件填充選項組的選擇框

Question

我不確定我的代碼出了什麼問題，我有幾個選擇框categories，我正在用json對象填充選項。

這裏是我的JSON文件

[{ 
    "Apparel": [{ 
    "val": "Footwear", 
    "text": "Footwear" 
    }, { 
    "val": "Lights", 
    "text": "Lights" 
    }, { 
    "val": "Accessories", 
    "text": "Accessories" 
    }], 

    "Automotive Parts": [{ 
    "val": "Hydraulic Parts", 
    "text": "Hydraulic Parts" 
    }, { 
    "val": "Plastic Parts", 
    "text": "Plastic Parts" 
    }], 
}] 

這裏是我的jQuery代碼。

$.getJSON("json/categories.json", function(json) { 
    $.each(json,function (i,optgroups){ 
     $.each(optgroups, function(groupName, options) { 
     var $optgroup = $("<optgroup>", { 
       label: groupName 
     }); 

     $optgroup.appendTo('.categories'); 

     $.each(options, function(j, option) { 
       var $option = $("<option>", { 
        text: option.text, 
        value: option.val 
       }); 
       $option.appendTo($optgroup); 
      }); 
     }); 
    }); 
}); 

選擇框有幾個選項，每組選項都屬於選項組。

問題是選項組標籤只填充而不是選項。

Answer 1

移動$ optgroup.appendTo（'。categories'）;之後第二個「每個」循環，應該工作。