jquery - 如何使两个列表可互换，以及选择完成时保存已删除

Question

我正在使用jQuery并同时指定两个selectors。然后我尝试在这段代码中引用每个变量：

UL_HeadersToOmit- 是可供选择的列表

UL_dropedCols- 是作为下一个函数或“阶段”的引用传递的列表

$('#next').click(
function () {

    var dropblUL = $('#UL_dropedCols li');
    alert(dropblUL.length);
});



$('#UL_dropedCols, #UL_HeadersToOmit')
    .sortable({
               connectWith: '#UL_HeadersToOmit, #UL_dropedCols'
             })
    .droppable({

            drop: function (event, ui) {
                     var curUL = $(this);
                    //.. now till here from what i could see in tests 
                    // drop is connected to the first  #dropedCols
                    // so if i wanted to specify same thing for second HeadersToOmit
                   // how will i do it ?

                  }
            });

我可以看到教程中的人正在连接

$(obj).draggable().droppable().sortable()

我想如果他们都引用一个对象，这没关系，但你将如何引用两个？

我的目标自然是：保存用户选择的内容......意思#UL_dropedCols是在选择结束时（记住用户正在他们两个之间来回播放）然后单击下一步。

更新

http://jsfiddle.net/rhW7C/46/embedded/result/

http://jsfiddle.net/rhW7C/46/

Answer 1

已解决：我错过了receive如下所示的事件。

$('document').ready(function() {

    var results = [];

    $('#UL_dropedCols, #UL_HeadersToOmit').sortable({
        tolerance: 'pointer',
        connectWith: '#UL_HeadersToOmit, #UL_dropedCols',
        receive: function(event, ui) {
            var draged = ui.item.attr("id");
            results.push(draged);
        }
    });

    $('#next').click(function() {
        var RLength = results.length;
        for (var i = 0; i < RLength; i++) {
            alert(results[i]);
        }
    });

});