javascript - 解析分组的json

Question

我有这个 JSON 结构:

{
 "2014": [
  "2014-01",
  "2014-02",
  "2014-03",
  ...
],
 "2015": [
  "2015-01",
  "2015-02",
  "2015-03",
  ...
]
}

...并且需要将该 JSON 解析为这样的 HTML 结构，无论是否使用 Jquery。

<select name="valueAA" id="valueAA">
    <optgroup label="2014">
        <option value="2014-01">Jan 2014</option>
        <option value="2014-02">Feb 2014</option>
        <option value="2014-03">Mar 2014</option>
                ...
    </optgroup>
    <optgroup label="2015">
        <option value="2015-01">Jan 2015</option>
        <option value="2015-02">Feb 2015</option>
        <option value="2015-03">Mar 2015</option>
                ...
    </optgroup>
</select>

谢谢!

更新:我更新了 JSON

Answer 1

您可以使用一些 jQuery 和 moment.js 来设置日期格式:

fiddler

HTML:

<select id="dates"></select>

JS:

var object = {
    "2014": [
      "2014-01",
      "2014-02",
      "2014-03"
    ],
    "2015": [
        "2015-01",
        "2015-02",
        "2015-03"
    ]
};

var $select = $('#dates');

$.each(object, function(year, dates) {
    var $optgroup = $('<optgroup/>').attr('label', year);
    $.each(dates, function(key, date) {
        $optgroup.append( 
            $('<option/>')
                .val(date)
                .text( moment(date, 'YYYY-MM').format('MMM YYYY') )
        );
    });
    $select.append($optgroup);
});