过滤对象答案

【问题标题】：Filter an Object过滤对象
【发布时间】：2014-01-18 00:42:22
【问题描述】：

我希望有人能指出我正确的方向或给我一个例子。我正在尝试使用具有四个过滤器选项的表单来过滤这个多维 json 对象（见下文）。

在用户做出选择并点击提交按钮后，该产品或服务的详细信息的结果将显示在页面上（即...该产品的链接、该产品的内容），也可以有多个根据搜索过滤器显示的产品或服务。有人可以帮帮我吗？

这是我的对象：

var data = {
        "Product":{"url":["http://www.google.com"],"mode":["gyro"],"modeOptions":["drop-controlled-descent","seated-wireline-steering","slickline-memory","surface-readout-ms","wireline-orientation"],"diameter":{"usa":"1.75","intl":"44.5mm"},"accuracy":{"usa":"0.5 deg","intl":"0.5 deg"},"temp":{"usa":"400F","intl":"204C"},"speed":{"usa":"250 ft\/min","intl":"76.2m\/min"}},
        "Service":{"url":["http://www.google.com"],"mode":["gyro"],"modeOptions":["drop-controlled-descent","seated-wireline-steering","slickline-memory","surface-readout-ms","wireline-orientation"],"diameter":{"usa":"(2.2)","intl":"(55.9mm)"},"accuracy":{"usa":"0.15 deg","intl":"0.15 deg"},"temp":{"usa":"(400F)","intl":"(204C)"},"speed":{"usa":"600 ft\/min","intl":"182.9m\/min"}}
        };

她是我的html表单：

<form name="searchForm" id="searchForm">
        <select name="diameter">
            <option value="" selected="">Select One</option>
            <option value="1.2">1.2</option>
            <option value="1.75">1.75</option>
            <option value="2.2">2.2</option>
        </select>
        <select name="accuracy">
            <option value="" selected="">Select One</option>
            <option value="0.15 deg">0.15</option>
            <option value="0.5 deg">0.5</option>
            <option value="1 deg">1</option>
            <option value="2.5 deg">2.5</option>
        </select>
        <select name="temp">
            <option value="" selected="">Select One</option>
            <option value="257F">257F</option>
            <option value="300F">300F</option>
            <option value="400F">400F</option>
        </select>
        <select name="modeOptions">
            <option value="" selected="">Select One</option>
            <option value="surface-readout-ms">Surface Readout/MS</option>
            <option value="wireline-orientation">Wireline Orientation</option>
            <option value="memory-orientation">Memory Orientation</option>
            <option value="slickline-memory">Slickline memory</option>
            <option value="drop-controlled-descent">Drop – Controlled Descent</option>
            <option value="drop–freefall-descent">Drop – Freefall Descent</option>
            <option value="seated-wireline-steering">Seated Wireline Steering</option>
        </select>
        <input type="submit" value="submit"/>
    </form>

【问题讨论】：

它是一个对象而不是一个数组
仅供参考，这不是一个数组，它是一个对象。但是，您可以使用 Object.keys(data).forEach() 对其进行迭代
Sorting a JSON object in Javascript的可能重复

标签： javascript jquery arrays

【解决方案1】：

获取TaffyDB. 它是为这类事情而设计的。

【讨论】：

【解决方案2】：

试试类似的东西

var $form = $('#searchForm'),
    $diameter = $form.find('select[name="diameter"]'),
    $accuracy = $form.find('select[name="accuracy"]'),
    $temp = $form.find('select[name="temp"]'),
    $modeOptions = $form.find('select[name="modeOptions"]');
$('#searchForm').submit(function (e) {
    e.preventDefault();
    var diameter = $diameter.val(),
        accuracy = $accuracy.val(),
        temp = $temp.val(),
        modeOptions = $modeOptions.val();

    var selected = $.map(data, function (obj) {
        return (!diameter || diameter == obj.diameter.usa) && (!accuracy || accuracy == obj.accuracy.usa) && (!temp || temp == obj.temp.usa) && (!modeOptions || $.inArray(modeOptions, obj.modeOptions) > -1) ? obj : undefined
    });

    //print result
    console.log('found:', selected);
    $('#result').html($.map(selected, function (val) {
        return '<p>' + JSON.stringify(val) + '</p>'
    }))
})

演示：Fiddle

【讨论】：