在json文件中有条件地选择数据

Question

有没有办法在json文件中有条件地选择数据

[
   {"id":1,"price":10},
   {"id":1,"price":20},
   {"id":1,"price":30},
   {"id":2,"price":50},
   {"id":2,"price":60},
]

点击html页面上的提交按钮，如果id = 1，那么只有id = 1的价格应该是可见的，而id = 2则相同。

我必须使用jquery。

Answer 1

您可以使用 filter() 来过滤数据。

var data = [{
  "id": 1,
  "price": 10
}, {
  "id": 1,
  "price": 20
}, {
  "id": 1,
  "price": 30
}, {
  "id": 2,
  "price": 50
}, {
  "id": 2,
  "price": 60
}, ];



$('#click').click(function() {
  var id = $('#id').val();
  console.log(data.filter(function(v) {
    return v.id == id;
  }));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="id">
  <option value="1">1</option>
  <option value="2">2</option>
</select>

<button id="click">click</button>

要获得一系列价格值，您可以使用 map()

var data = [{
  "id": 1,
  "price": 10
}, {
  "id": 1,
  "price": 20
}, {
  "id": 1,
  "price": 30
}, {
  "id": 2,
  "price": 50
}, {
  "id": 2,
  "price": 60
}, ];



$('#click').click(function() {
  var id = $('#id').val();
  $('#val').html(data.filter(function(v) {
    return v.id == id;
  }).map(function(v) {
    return v.price;
  }).join());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="id">
  <option value="1">1</option>
  <option value="2">2</option>
</select>
<div id="val"></div>

<button id="click">click</button>