javascript - Javascript - 多维数组排序 - 字符串和整数 - 按整数排序

Question

在我的javascript应用程序中拖动div之后......我想为所有div分配一个数字类，按位置排序。我已经研究了很多，并建立了下一个......但它只是不起作用。（内部 HTML 不变）

var ele = document.getElementsByTagName("div");
var i = 0;
var MyDrags = [];

while(ele[i]) {
    if(ele[i].id.substr(0, 4)=="drag") {
        MyDrags["distance"]=parseInt(document.getElementById(ele[i].id).style.top,10);
        MyDrags["id"]=ele[i].id;
    }
    i++;
}
MyDrags.sort(function(a,b) {
    return a.distance - b.distance;
});
i = 0;
while(MyDrags["distance"][i]) {
    document.getElementById(MyDrags["id"][i]).innerHTML=MyDrags["distance"][i];
    i++;
}

Answer 1

这是因为您正在覆盖以前的值，您需要在每次迭代中分配一个新对象，以使您的代码正常工作，它应该如下所示：

var ele = document.getElementsByTagName('div');
var i = 0;
var MyDrags = [], dst;

while (ele[i]) {
    if (ele[i].id.substr(0, 4) === 'drag') {
        MyDrags.push({
            distance: parseInt(document.getElementById(ele[i].id).style.top, 10),
            id: ele[i].id
        });
    }
    i++;
}

MyDrags.sort(function(a, b) {
    return a.distance - b.distance;
});

i = 0; 
while(MyDrags[i]) {
    if (dst = MyDrags[i]['distance']) {
        document.getElementById(MyDrags[i]['id']).style.top = dst + 'px';
        document.getElementById(MyDrags[i++]['id']).innerHTML = dst;
    }
}