跟蹤jQuery中所有元素的排序排序

我想弄清楚如何跟蹤jQuery中的元素如何排序。假設我的排序中有四個元素（div），每個元素都有一個唯一的id。我們稱他們爲＃100，＃200，＃300和＃400，然後按照這個順序開始。但是當我將＃100移動到第3個點時，我需要能夠保存這個ID的新位置，但也要確保其他位置也獲得更新的位置值。跟蹤jQuery中所有元素的排序排序

我有什麼意義嗎？基本上我想獲得每個唯一ID的位置，所以我可以保存列表的順序以備後用。

我一直沒能找到的東西，在一個排序的所有元素的報道，只是已移動的一個..

點我在正確的方向？謝謝

來源

2011-07-17 INT

您可以使用提供給您的停止事件進行排序以跟蹤這些項目。這是一個小例子;

(function($) { 
    $('#sortable').sortable({ 
     stop: function(e, ui) { 
      console.log($.map($(this).find('li'), function(el) { 
       return el.id + ' = ' + $(el).index(); 
      })); 
     } 
    }); 
})(jQuery);

這記錄了排序中所有項目的數組及其id和當前索引。

這裏是一個的jsfiddle工作示例以及：http://jsfiddle.net/beyondsanity/HgDZ9/

來源

2011-07-17 21:35:34

沒問題！小改進已被編輯，使用「this」而不是「el」，並使用this.id而不是$（el）.attr（'id'），因爲後者是沒有必要的，因爲我們沒有進行任何鏈接。小提琴保持與舊的例子相同，所以你可以比較兩個:) –

嘗試更新的代碼，但它不工作。有任何想法嗎？ http://jsfiddle.net/LxMhF/2/ – INT

看來我搞砸了一點，我們確實需要「el」，因爲$ .map中的「this」是「window」對象，而不是當前元素。「this」是$ .fn.map（$（selector）.map（fn））中的當前元素，只是爲了說明清楚。 –

可能的重複jQuery UI Sortable Position。

基本上，獲得元素的排序（或只是一個普通的老父母的Elemen）內的位置，只是像

$('#300').index();

如果什麼也沒有移動，這個代碼將返回2（index()開始計數在零處），並在元素重新排列時更新。

下面是一個演示：http://jsfiddle.net/XB5Dh/。您可以單擊某個元素以查看其位置，並在拖動元素時顯示新位置。

來源

2011-07-17 21:33:39 varchar255

按照文檔http://api.jqueryui.com/sortable/#method-toArray我建議你使用內置方法toArray。例如：

$(document).ready(function() { 
    $('#sortable').sortable({ 
     stop: function(e, ui) { 
     console.log($('#sortable').sortable('toArray')); 
     } 
    }); 
    $('#sortable').disableSelection(); 
    });

來源

2014-12-11 13:02:06 jmarceli

這是我需要的，謝謝。 –

跟蹤jQuery中所有元素的排序排序

回答

相關問題