Question

我正在尝试从隐藏的输入字段中获取值，并将它们粘贴到我可以通过AJAX发布到URL的对象中。我能够获取值，但不能按照我需要它的顺序。我抓住这样的价值观：

var music = {};

var album_name = $(".album_name").each(function() {
    music[$(this).attr("value")] = $(this).val();
     // console.log($(this).val());
});
$(".song_title").each(function() {
    music[$(this).attr("value")] = $(this).val();
     // console.log($(this).val());
});
$(".album_image").each(function() {
    music[$(this).attr("value")] = $(this).val();
     console.log($(this).val());
});

结果就像这样：

{"Album 1":"Album 1","Album 2":"Album 2","Album 3":"Album 3","Album 4":"Album 4","Song 1":"Song 1","Song 2":"Song 2","Song 3":"Song 3","Song 4":"Song 4","thumbnail.png":"thumbnail.png"}

无论如何都要让对象以这种顺序出现：

{"Album":"Album 1","Song":"Song 1","Image":"thumbnail.png","Album":"Album 2","Song":"Song 2","Image":"thumbnail.png","Album":"Album 3","Song":"Song 3","Image":"thumbnail.png","Album":"Album 4","Song":"Song 4","Image":"thumbnail.png",}

提前感谢您的帮助。

Answer 1

安迪指出，物体本质上是无序的。但是，如果要使用二维数组，则与“1”相关的值可以作为数组放在第一个值中。

例如：

[{"Album":"Album 1","Song":"Song 1","Image":"thumbnail.png"},{"Album":"Album 2","Song":"Song 2","Image":"thumbnail.png"},{"Album":"Album 3","Song":"Song 3","Image":"thumbnail.png"},{"Album":"Album 4","Song":"Song 4","Image":"thumbnail.png"}]

Answer 2

这与您想要的内容略有不同，但如果您能够考虑订购项目，您的JSON可能会这样：

{
    "Album 1": {
        "Song":"Song 1",
        "Image":"thumbnail.png"
    },
    "Album 2": {
        "Song":"Song 2",
        "Image":"thumbnail.png"
    },
    "Album 3": {
        "Song":"Song 3",
        "Image":"thumbnail.png"
    }
}

然后，当您遍历相册名称字段时，您可以从相应的歌曲和图像字段中获取数据以添加到数组中。

var album_name = $(".album_name").each(function(a,b) {
    music[$(b).attr("value")] = $(b).val();
    music[$('.song_title')[a].attr("value")] = $('.song_title')[a]).val();
    music[$('.album_image')[a].attr("value")] = $('.album_image')[a]).val();
});

请注意，此解决方案完全取决于这些元素如何呈现到屏幕上。只要它们按照我们抓住它们的顺序呈现（第一张专辑，第一首歌，第一张图像，第二张专辑，......），那么我们就是好的。

Answer 3

这里有一些不同的考虑因素。

迭代JS对象属性（for (x in obj){...}）并不保证任何特定的顺序
jQuery each()方法的文档没有说明它如何迭代属性，尽管如果对象是类似数组（具有length属性），它将被视为数组并且可能按顺序返回编号的键
DOM集合通常 do 具有已定义的顺序;例如，document.getElementsByClassName('album_name')将返回一个类似于数组的对象，其中包含所需元素的顺序，它们与源代码中出现的顺序相同（即使DOM是动态填充的）。

所以，以下（非jQuery）代码：

var albums = document.getElementsByClassName('album_name');
var i=0;
for (i=0;i<albums.length;i++) {
    doSomethingWithAlbumName(albums[i].value);
}

将以正确的顺序处理每个.album_name输入。我不确定这是不是被问到了什么;如果你只想保证console.log打印出对象属性的顺序，那是不可能的。

循环输入值并将它们按特定顺序放入对象中

3 个答案: