Question

我有以下问题：

我有一个带有一个图像的可排序的ul（绿色框）。我希望能够将此图像拖动到任何位置，并在此位置创建一个新的可排序的ul（灰色框）。

这部分完美无缺。

现在我也希望能够将图像从灰色框拖回绿色框。除了一部分外，它也可以正常工作：在拖动过程中，图像是不可见的。如何在拖动过程中使图像可见？

我已经检查过：两个uls似乎都有相同的父，我提醒两个uls的parentIds，它是相同的。在两种情况下都是#images

我该如何解决这个问题？

我为它创建了一个jsfiddle：a link

$(document).ready (function() {   

                                  $( "ul" ).sortable({opacity:0.4, connectWith: 'ul', dropOnfull: true, stop: function (event,ui){
                                       var positionLeft=ui.position.left;
                                       var positionTop=ui.position.top;

                                       var x=$ ("<ul id='sortable10' class='drop'></ul>");
                                       $(x).css('position','absolute');
                                       $(x).css('left',positionLeft);
                                       $(x).css('top',positionTop); 
                                       $(x).css('height','70px');


                                       ui.item.appendTo(x);

                                       $(x).sortable({connectWith: 'ul'});
                                       $('#images').append(x);


                                       $( "ul" ).sortable({ connectWith: 'ul'});
                                         alert("ParentId of the gray box is "+$('ul#sortable10 ').parent().attr('id'));
                                         alert("ParentId of the green box is "+$('ul#sortable1 ').parent().attr('id'));
                                       } // stop-function
                                   });//sortable-options

                              })//main-function

Answer 1

我的猜测是ul正在'隐藏'元素..当你拖动它时你仍然可以看到图像直到ul的边界..

我认为你需要使用div或spans并使用jQuery ui中的dragg ..

Jquery UI可排序问题：图像在动态创建的可排序后丢弃后不可见（两个uls具有相同的父div）

1 个答案: