Javascript - 多維數組排序 - 字符串和Int - 訂購Int

在我的javascript應用程序中拖動div後...我想爲所有div指定一個數字類，按位置排序。我已經研究了很多，並且構建了下一個......但它不起作用。（內蒙古HTML不改變）Javascript - 多維數組排序 - 字符串和Int - 訂購Int

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++; 
}

來源

2012-07-31 Kenedy

我強烈建議如果你打算做DOM操作來使用Jquery或其他庫。如果你做了任何複雜的事情，它會變得毛茸茸的。 – VoronoiPotato 2012-07-31 12:38:55

使用'MyDrags = []'而不是'MyDrags = new Array（）' - 它更清晰並且[更高性能]（http://jsperf.com/literal-vs-constructor-array/4）。 – 2012-07-31 12:41:13

@ChrisFrancis謝謝你，我測試了兩次......並且'new Array（）'總是最快的。但是，我將改變創建陣列的方式:) – Kenedy 2012-07-31 13:32:34

這是因爲要覆蓋以前的值，則需要在每個迭代分配一個新的對象，有你的代碼的工作，它應該是這樣的：

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; 
    } 
}

來源

2012-07-31 12:34:23 epoch

謝謝：D但是當我嘗試你的代碼時，瀏覽器在拖動div後（當調用排序代碼時）崩潰......並且它什麼都不做。創建數組時，「dst」是什麼意思？ – Kenedy 2012-07-31 13:17:00

@Kenedy，我只是指出了語法/用法錯誤，我沒有其他頁面的上下文，你會介意發佈一個完整的jsfiddle嗎？ – epoch 2012-07-31 13:18:31

是的，當然......謝謝！：D我粘貼了我原來的HTML代碼，但它在小提琴中不起作用。無論如何，這是原始的完整代碼。 URL：http://jsfiddle.net/S7yVC/ – Kenedy 2012-07-31 13:30:47

Javascript - 多維數組排序 - 字符串和Int - 訂購Int

回答

相關問題