JavaScript按值对数组进行排序

Question

JavaScript按值对数组进行排序

13

我有一个返回JSON的AJAX调用，例如...

{
  490: "A",
  675: "B",
  491: "C",
  520: "D",
  681: "E",
  679: "F",
  538: "G"    
}

我随后使用以下代码将它附加到一个 select 元素中：

var output = jQuery.parseJSON(data);

$.each(output, function(key, value) {
    $el.append($("<option></option>")
       .attr("value", key).text(value));
});

我想按值进行排序，以便输出结果为A,B,C,D...，因为现在它只按键的顺序读取。

问题是 - 看起来在Firefox中运行良好，在Chrome中不行。

- Fluidbyte

是的，在Firefox或Chrome中没有错误。 - Fluidbyte

在Firefox中正常工作但在Chrome中不行的是什么？是输出附加吗？还是你没有向我们展示某些排序算法？ - Heretic Monkey

你尝试过以任何方式进行调试吗？例如，在排序之前和之后的某个阶段输出任何内容？ - Jon Taylor

你能在服务器端进行排序吗？ - Roberto Maldonado

我已经在服务器端对其进行了排序，这是（目前）唯一的排序方式（ORDER BY 'name'）。 - Fluidbyte

显示剩余2条评论

3个回答

2

对象无法排序。尝试将您的JSON作为数组返回，以确保它保持在您返回的确切顺序中：

[
  {"id":490,"name":"A"},
  {"id":675,"name":"B"},
  {"id":491,"name":"C"},
  {"id":520,"name":"D"},
  {"id":681,"name":"E"},
  {"id":679,"name":"F"},
  {"id":538,"name":"G"}
]

这里有一个具有原始代码的小示例：http://jsfiddle.net/82BSm/2/，并将其转换为一个数组：http://jsfiddle.net/82BSm/1/

根据 pst 的评论进行了更新

当然，您可以通过将列名（“id”和“name”）与数据分离并使其成为一组数组来缩小 JSON 响应大小。

- Kevin B

1

我认为这不是一个真正的问题，因为它返回的顺序与显示顺序无关。看起来OP希望对一组未排序的值进行排序，在这种情况下，他返回的对象可以很好地完成这项工作。尽管如此，我可能是完全错误的。 - Jon Taylor

@JonTaylor 我同意，不过我怀疑他实际使用的数据可能与他发布的不同。 - Kevin B

是的，我得到的数据有600个条目和一堆信息。我发布了一个例子。这些ID是与数据相关联的ID。 - Fluidbyte

@Fluidbyte 对的，看看我刚刚添加的代码片段，它们表明当使用对象时，排序顺序会改变，但是当使用数组时，它保持相同的排序顺序。 - Kevin B

1

+1 - 如果服务器上有排序功能，那么这是一个干净的选项。然而，我会使用[[490，"A"]，..]或[{id: 490, val: "A"}, ..]，因为在这里490并不真正起到键的作用。 - user166390

0

这样怎么样？

var output = jQuery.parseJSON(data);

var options = [];
$.each(output, function(key, value) {
    options.push(
        $("<option>").val(key).text(value)
    );
});

options.sort(function(a, b) {
    return a.text() > b.text();
});

- David Sanders

排序应该返回一个整数而不是布尔值（尽管在至少FF中，布尔值也可以工作），因此将其改为a.text() - b.text()以在更多浏览器中起作用。 - Craig

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Anoop · Accepted Answer

首先将其转换为数组，排序后再创建HTML。jsfiddle

var output = jQuery.parseJSON(data);
var temp = [];

$.each(output, function(key, value) {
    temp.push({v:value, k: key});
});
temp.sort(function(a,b){
   if(a.v > b.v){ return 1}
    if(a.v < b.v){ return -1}
      return 0;
});
$.each(temp, function(key, obj) {

$el.append($("<option></option>")
       .attr("value", obj.k).text(obj.v));
});