jQuery grep 返回多维数组答案

【问题标题】：jQuery grep return on Multidimensional ArrayjQuery grep 返回多维数组
【发布时间】：2013-10-22 05:39:54
【问题描述】：

我正在学习 jQuery，但在试图弄清楚如何选择多维数组中的元素时遇到了问题。我有一个带有数据库 ID 的选择列表，我想根据所选的 ID 在数据库中设置一个带有成本字段的 var。除了将选定的 ID 转换为成本之外，我拥有所有的东西。有人可以帮我解决这个问题吗？

var rangeListData = [{"idrange_list":"1","range_cost":"0","target_range_name":"Self Only"},{"idrange_list":"2","range_cost":"1","target_range_name":"1 Space"},{"idrange_list":"3","range_cost":"2","target_range_name":"2 Spaces"},{"idrange_list":"4","range_cost":"3","target_range_name":"3 Spaces"},{"idrange_list":"5","range_cost":"4","target_range_name":"4 Spaces"},{"idrange_list":"6","range_cost":"5","target_range_name":"5 Spaces"}];

$('#slctPowerTarget').change(function () {
    var targetID = $('#slctPowerTarget').val();
    var cost $.grep(rangeListData, function(e) { return e.idrange_list == targetID }); // this is the line that is wrong
    $('#spanTotalEffectsCost').text(cost);

});

如果我将 targetID 放在 cost 所在的位置，它会很好地列出。但是，当我尝试查找此内容时，什么也没有发生。不知何故这是不对的，我不确定还有什么可以尝试的。我想我知道 idrange_list == targetID 应该如何匹配它们，但不确定如何调用相关的 range_cost。

感谢您提供的任何帮助！我阅读了 jquery.com 上的文档，但似乎无法理解它们。

【问题讨论】：

标签： javascript jquery arrays multidimensional-array grep

【解决方案1】：

你可以这样做：-

// Get the Multidimensional Array first
var data = $.grep(rangeListData, function (e) {
    return e.idrange_list === targetID
});

// Get the range cost from the array
var cost = data[0].range_cost;

// Check the value in console for debugging purpose
console.log(cost);

【讨论】：

太棒了！这成功了。我看到我忘记从被过滤的对象中选择我需要的东西。因为它有很多对象，而不仅仅是一个标准数组。我需要找到对象，然后在该对象中找到我需要的东西。它似乎是 jQuery 中的一个两步过程。我还看到你添加了 === 这也是一个很好的电话。感谢您通过这种新语言帮助我睡眠不足的大脑工作！

【解决方案2】：

这是最终代码。我还在其中添加了一个 IF 子句，以防他们选择默认设置。这样，无论他们更改下拉菜单还是返回“选择...”，它都会重置而不是抛出错误并保持页面计算正常工作。

$('#slctPowerRange').change(function () {
    var rangeID = $('#slctPowerRange').val();
    if (rangeID > 0) {
        var rdata = $.grep(rangeListData, function (e) { 
            return e.idrange_list === rangeID 
            });
        var rcost = rdata[0].range_cost;
    }
    else {
        var rcost = 0 ;
    }
    $('#hdnRangeCost').val(rcost);
});

【讨论】：