一页上的jQuery多个可排序列表

Question

我的页面可以在一个页面上包含多个不同的媒体库。每个图库拇指在编辑模式下都是“可排序的”。这是第一个找到的作品，但每个额外的画廊都不会排序。我相信这是因为每个可排序列表都设置为具有类.dynamic_med_gallery 的容器，因此每个附加的可排序对象都试图使用具有类.dynamic_med_gallery 的第一个div 容器。如何将每个容器设置为 $(this) 以保持每个容器独立且唯一？

function sort_thumbs() {
   if (edit_mode == 'on') {
      var cont = $( ".dynamic_med_gallery" );
      cont.sortable({
         tolerance: 'pointer', 
         containment: cont, 
         items:'.dynamic_thumb',
         stop : function() {
            cont.addClass('update_index')
         }
      }).disableSelection();
   }
};

Answer 1

这应该可以为您解决问题。 http://jsfiddle.net/qBzRC/27/

edit_mode = 'on';
if (edit_mode == 'on') {
    $(".dynamic_med_gallery").each(function () {
        $(this).sortable({
            tolerance: 'pointer',
            containment: $(this),
            items: '.dynamic_thumb',
            stop: function () {
                $(this).addClass('update_index'); // Not sure what this is for... might need changing depending on your needs.
            }
        }).disableSelection();
    });
}

Answer 2

我想了很多，结果如下：

function sort_thumbs() {
    if (edit_mode == 'on') {
        $( ".dynamic_med_gallery" ).each(function() {
            cont = $(this);
            var this_id = cont.attr('id');

            cont.sortable({
                tolerance: 'pointer', 
                containment: cont, 
                items:'.dynamic_thumb',
                stop : function() {
                      $('#'+this_id).addClass('update_index');
                }
            }).disableSelection();
        });
    }
};