JQuery UI 'Droppable' 的问题

Question

这是我遇到的问题： 我已经创建了几个可拖动元素，但是当我将一个放在可放置元素上时，它不会留在那里。 以下是更多详细信息。

我的 JavaScript 函数从 PHP 接收 JSON 数组，然后使用循环创建可拖动元素：

<script type="text/javascript">
    function init() {
        var items = <?php echo $result_j;?>; //items is an one dimensional array

        for ( var i=0; i<<?php echo $total_rows_j;?>; i++ ) {      
            $('<div>' + items[i] + '</div>').data( 'item_name', items[i] ).attr( 'class', 'snk_button' ).appendTo( '#drag' );
         }

使用 'items' 数组，我创建了几个 div 元素（上面的代码），然后我将它们变成可拖动的元素（下面的代码）。

         $(".snk_button").draggable( {
            containment: '#drag_section',//Div #drag_section contains the Div #drag 
            stack: '#drag div',
            cursor: 'move',
            revert: true
         } )

所以，到目前为止，一切似乎都如预期的那样，我可以拖动我的元素（从“项目”数组创建）。

接下来，我创建了如下所示的可放置元素：

         $( "#dropp" ).droppable({
         drop: function() {
         alert('ok');
             }
         });
    }// End function init()
</script>

但是当我在这个可放置元素上拖动我的一个可拖动元素时，我什至会收到警报，但可拖动元素不会停留在可放置元素上。

谁能帮我确定为什么我的可拖动元素没有停留在可放置元素上？

提前感谢您的帮助！

Answer 1

你用过revert :true..意思是

Revert 表示如果设置为true，则元素将在拖动停止时返回到其起始位置。可能的字符串值：“有效”、“无效”。如果设置为无效，则仅当可拖动对象未放置在可放置对象上时才会发生还原。如果有效，则相反。

您可能需要invalid，以防您的draggable 元素没有放在正确的元素上

Answer 2

非常感谢您为我指明了正确的方向。 我已经通过以下方式解决了这个特殊问题：

我已经编辑了我的可放置代码如下：

$( "#filtered" ).droppable(
   drop: handleDrop
});

function handleDrop( event, ui ) {
    ui.draggable.draggable( 'option', 'revert', false );
} // End function handleDrop

这解决了draggable不停留在droppable上的问题（前面已经描述过）。