0

我有以下问题:

我有一张带有一张图片(绿色框)的可排序 ul。我希望能够将此图像拖动到任何地方并在此位置创建一个新的可排序 ul(灰色框)。

这部分工作完美。

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

我已经检查过:两个 uls 似乎有相同的父级,我提醒两个 uls 的 parentIds 并且它是相同的。在这两种情况下#images

我该如何解决这个问题?

我为它创建了一个 jsfiddle:一个链接

$(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
4

1 回答 1

0

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

我认为您需要使用 divs 或 spans 并利用 jQuery ui 的可拖动 ..

于 2013-07-13T19:10:20.810 回答