使用jQuery在下拉列表中绑定JSON

时间:2017-02-03 11:42:27

标签: javascript jquery

我有JSON格式的回复。如何绑定其对象值及其值 使用jQuery下拉列表中的15m值?如何访问这些值?

{
  "USD": {
    "15m": 478.68,
    "last": 478.68,
    "buy": 478.55,
    "sell": 478.68,
    "symbol": "$"
  },
  "JPY": {
    "15m": 51033.99,
    "last": 51033.99,
    "buy": 51020.13,
    "sell": 51033.99,
    "symbol": "¥"
  },
  "CNY": {
    "15m": 2937.05,
    "last": 2937.05,
    "buy": 2936.25,
    "sell": 2937.05,
    "symbol": "¥"
  },
  "SGD": {
    "15m": 605.39,
    "last": 605.39,
    "buy": 605.22,
    "sell": 605.39,
    "symbol": "$"
  },
  "HKD": {
    "15m": 3709.91,
    "last": 3709.91,
    "buy": 3708.9,
    "sell": 3709.91,
    "symbol": "$"
  },
  "CAD": {
    "15m": 526.72,
    "last": 526.72,
    "buy": 526.58,
    "sell": 526.72,
    "symbol": "$"
  },
  "NZD": {
    "15m": 582.26,
    "last": 582.26,
    "buy": 582.1,
    "sell": 582.26,
    "symbol": "$"
  },
}

1 个答案:

答案 0 :(得分:1)

https://plnkr.co/edit/53kBpBYWGrjnEobXyNLx?p=preview

我创造了这个小提琴来做这个

$.each(response, function(index, result) {
    var opt = $("<option>",{
        "text":index,
        "Value":result["15m"]
    });
$("#try").append(opt);

$(document).ready(function() {
  $("#active").on("click", function() {
    response = {
  "USD" : {"15m" : 478.68, "last" : 478.68, "buy" : 478.55, "sell" : 478.68,  "symbol" : "$"},
  "JPY" : {"15m" : 51033.99, "last" : 51033.99, "buy" : 51020.13, "sell" : 51033.99,  "symbol" : "¥"},
  "CNY" : {"15m" : 2937.05, "last" : 2937.05, "buy" : 2936.25, "sell" : 2937.05,  "symbol" : "¥"},
  "SGD" : {"15m" : 605.39, "last" : 605.39, "buy" : 605.22, "sell" : 605.39,  "symbol" : "$"},
  "HKD" : {"15m" : 3709.91, "last" : 3709.91, "buy" : 3708.9, "sell" : 3709.91,  "symbol" : "$"},
  "CAD" : {"15m" : 526.72, "last" : 526.72, "buy" : 526.58, "sell" : 526.72,  "symbol" : "$"},
  "NZD" : {"15m" : 582.26, "last" : 582.26, "buy" : 582.1, "sell" : 582.26,  "symbol" : "$"}
};
    $.each(response, function(index, result) {
      var opt = $("<option>",{
        "text":index,
        "Value":result["15m"]
      });
$("#try").append(opt);
    });
  })
});
/* Styles go here */

#a{
  height:10000px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="day">
<select id = "try"></select>
<button id="active">Press me for change</button>