Javascript 使用jquery从json过滤搜索

我正在构建一个onine bus预订web应用程序，如

redbus。在
中，我希望实现过滤器搜索功能，就像它在redbus中的实现方式一样

这是工作流程

1.有4个下拉框，其中包含值
droppint point
，
boardingpoint
，
bustype
，
opeartor name

2.当用户从下拉列表中选择一个
下车点
时，结果将仅显示具有该下车点的公交车列表，如果用户选择
下车点
和
上车点
，则将显示仅包含其中两个的公交车列表，以此类推

Ie无论用户从这4个下拉菜单中选择什么，结果（总线列表）将仅包含这些值

但我不知道如何实现它，尤其是过滤

下面是一个总线的json示例

{
      "droppingPoints": [
  {
          "time": "09:45 PM",
          "location": "Kachiguda",
          "id": "1283518"
        },
        {
          "time": "09:55 PM",
          "location": "Narayanaguda",
          "id": "1283519"
        },
        {
          "time": "10:05 PM",
          "location": "Lakdi ka pool",
          "id": "1283520"
        },
        {
          "time": "10:15 PM",
          "location": "Punjagutta",
          "id": "1283521"
        },
        {
          "time": "10:25 PM",
          "location": "Srinivasa Colony",
          "id": "1283522"
        },
        {
          "time": "10:25 PM",
          "location": "SR Nagar",
          "id": "1283523"
        },
        {
          "time": "10:25 PM",
          "location": "Ameerpet",
          "id": "1283524"
        },
        {
          "time": "10:30 PM",
          "location": "Erragadda",
          "id": "1283525"
        },
        {
          "time": "10:35 PM",
          "location": "Bharat Nagar",
          "id": "1283526"
        },
        {
          "time": "10:40 PM",
          "location": "VIVEKANANDA NAGAR",
          "id": "1283527"
        },
        {
          "time": "10:40 PM",
          "location": "Kukatpally",
          "id": "1282840"
        },
          ],
      "availableSeats": 4,
      "partialCancellationAllowed": false,
      "arrivalTime": "07:00 AM",
      "boardingPoints": [

        {
          "time": "10:45 PM",
          "location": "K P H B",
          "id": "1282841"
        },
        {
          "time": "10:55 PM",
          "location": "Hydernagar",
          "id": "1283073"
        },
        {
          "time": "10:55 PM",
          "location": "Nizampet",
          "id": "1283074"
        },
        {
          "time": "11:00 PM",
          "location": "MiyaPur",
          "id": "1283072"
        },
        {
          "time": "11:05 PM",
          "location": "Miyapur Allwin X Road",
          "id": "1283422"
        },
        {
          "time": "11:15 PM",
          "location": "Kondapur",
          "id": "1283423"
        },
        {
          "time": "11:20 PM",
          "location": "Gachibowli",
          "id": "1283554"
        }
      ],
      "operatorName": "Morning Star Travels",
      "departureTime": "10:30 PM",
      "mTicketAllowed": true,
      "idProofRequired": true,
      "serviceId": "1572",
      "fare": "1090.0, 1190.0",
      "busType": "2+1 Sleeper Non A/C",
      "routeScheduleId": "84W157YI3YGZKH5B9K0TG4E40VI13",
      "commPCT": 7.6,
      "operatorId": 1572,
      "inventoryType": 2
    }

目前我手里有这个代码

<script>
//when select item from dropping point
$('.drp').on('change',function(){
   search_buses();
});

//when select item from boarding point
$('.brp').on('change',function(){
   search_buses();
});

//when select item from butype
$('.bt').on('change',function(){
    search_buses();
});
//when select item from opearto name
$('.on').on('change',function(){
   search_buses();
});
//function for searching 
function search_buses(){
 //list of buses in json format.
  var bus_list;
}
</script>


//从放置点选择项目时
$（'.drp'）。on（'change'，function（）{
搜索_总线（）；
});
//从登机点选择物品时
$（'.brp'）。on（'change'，function（）{
搜索_总线（）；
});
//从列表中选择项目时
$（'.bt'）。在（'change'，function（）上{
搜索_总线（）；
});
//从opearto名称中选择项目时
$（'.on'）.on（'change'，function（）{
搜索_总线（）；
});
//搜索功能
函数搜索_总线（）{
//json格式的总线列表。
var总线列表；
}

我想在
search\u bus
函数中实现过滤器功能。但是我不知道怎么做。
过滤就像使用
过滤器和
一些
javascrip方法一样简单：

function searchBusesByLocation(location) {
    filteredBuses = busesArray.filter(function (bus) {//this will create a new array with the filtered items
        return boardingPointLocationComparisson(bus, location);
    });

    return filteredBuses;
}

function boardingPointLocationComparisson(bus, location) {//i'm guessin you want to filter by location, you can do by date or adapt this function like you want
    return bus.boardingPoints.some(function (boardingPoint) {
        //the some function will iterate over the array and return true whenever the comparisson is true, false otherwise
        return boardingPoint.location === location;
    })
}

然后在用户输入的位置上调用
searchBusesByLocation
事件上的
searchBusesByLocation
（您可以根据其他情况调整代码）。
首先，我想您应该为
search_bus（）
（或
search_bus（）
？）指定一个参数。第2点：
search\u bus（）
中的
bus\u list
是否引用了您在问题开头显示的json？您能否在问题中包括
html
？还包括json的来源我想这是动态列表。可能是ajax或soemthing：）Json就是服务器端或客户端上的Json吗？如何呈现它？对于客户端的过滤，您可能希望使用类似angular的mvc框架。这些框架已经涵盖了过滤/排序等基本功能。。。