1

当我将多个项目拖放到特定的 div 时，它只需要第一个元素。后来当我签入 console.log($(ui.draggable)) 长度为 1。

({selector:"", context:#1=({}), 0:#1#, length:1})  when i dragged 3 elements

请帮助我哪里出错了？？

http://jsfiddle.net/akkiys/Hkfh2/4/

HTML 如下所示：

<ul id="drag" >
    <li id="1">one</li>  
    <li id="2">two</li>    
    <li id="3">three</li>  
    <li id="4">four</li> 
    <li id="5">five</li>        
</ul>

和 JavaScript：

var selectedClass = 'ui-state-highlight',
    clickDelay = 600,
    // click time (milliseconds)
    lastClick, diffClick; // timestamps
$("#drag li")
// Script to deferentiate a click from a mousedown for drag event
.bind('mousedown mouseup', function(e) {
    if (e.type == "mousedown") {
        lastClick = e.timeStamp; // get mousedown time
    } else {
        diffClick = e.timeStamp - lastClick;
        if (diffClick < clickDelay) {
            // add selected class to group draggable objects
            $(this).toggleClass(selectedClass);
        }
    }
}).draggable({
    scroll: false,
    revertDuration: 10,
    // grouped items animate separately, so   leave this number low
    start: function(e, ui) {
        ui.helper.addClass(selectedClass);
    },
    stop: function(e, ui) {
        // reset group positions
        $('.' + selectedClass).css({
            top: 0,
            left: 0
        });
    },
    drag: function(e, ui) {
        // set selected group position to main dragged object
        // this works because the position is relative to the starting position
        $('.' + selectedClass).css({
            top: ui.position.top,
            left: ui.position.left
        });


    }
});

$(".drop").droppable({


    drop: function(event, ui) {


        var droppableId = $(this).find('div.inner').attr("id");

        //var id = ui.draggable.attr("id");   // i need to retrive multiple id
        console.log($(ui.draggable))
        var m_id = [];

        $.each($(ui.draggable), function(i, e) {
            m_id.push(e.id);
            alert(m_id);
        });
        console.log(m_id);


    }
});
4

1 回答 1

0

我不知道这个问题自创建和最新贡献以来已经过去了一年，但我只是偶然发现它并认为我尝试贡献，即使我在这些事情上完全是新手。希望有人会使用它。

我可以看到的基本上是：由于您使用类（'.' + selectedClass）拖动所有元素，因此您还应该在放置事件中检查相同的元素。

这样做的原因是你不是真的'jquery-dragging'多个项目，你只是通过一致地移动元素来视觉模拟它，围绕jquery将感知为实际被拖动的元素的元素。如果你在检查时运行小提琴，你会看到你选择的类在所有列表元素上切换，但是当你开始拖动时，只有一个元素将包含 jquery 使用的 .ui-draggable-dragging 类。

只需将 drop examplecode 中的标识符更改为 selectedClass 即可让您找到多个 id，例如：

$.each($("."+ selectedClass), function(i, e) {
m_id.push(e.id);
alert(m_id);
});
于 2013-10-04T09:25:47.127 回答