jquery - jQuery ui - droppable 中的 droppable

Question

我在 droppable 中使用 droppable，但子 droppable 不起作用。

我想做什么

• 我有一个父母 droppable #droppable。
• 我的第一个父级 droppable 接受两个元素#child-drop1和#child-drop2.
• 我再次想要以上两个元素#child-drop1并#child-drop2充当可放置的包装器。
• 但是现在当我想在子可放置注意中删除元素时会发生。
• 就这样。

---

   jQuery( '#droppable' ).droppable({
        activeClass: 'active',
        accept:'#child-drop1, #child-drop2',
        hoverClass: 'hover',
        drop: function( event, ui ) {
            jQuery('<div id="child-drop"><div>).appendTo( this );
        }
    }); 

    jQuery( '#child-drop1, #child-drop2' ).droppable({
        activeClass: 'active',
        accept:'#child-child-drop',
        hoverClass: 'hover',
        drop: function( event, ui ) {
            jQuery('<div id="child-child-drop"><div>').appendTo( this );
        }
    });

Answer 1

我添加了以下代码和 HTML & CSS 用于演示及其工作正常的jsFiddle

jQuery('#child-drop1, #child-drop2, #child-child-drop').draggable({revert: 'invalid'});