切换(隐藏/显示)可放置面板时jquery奇怪的行为

根据此处发布的代码,我有几个可拖动/可隐藏的盒子: http ://webdeveloperplus.com/jquery/saving-state-for-collapsible-drag-drop-panels/

我还有一个区域列表,我可以拖动到这些框中的任何一个,然后对它们进行排序。 这很好用。 只有当我开始切换这些盒子或移动他们的位置时,事情才开始变得奇怪。

例1

假设我有3个垂直堆叠的盒子:

BOX1

BOX2

BOX3

块可以拖入(并排序)好。 如果我然后将Box2移到Box1上方,那么订单现在是:

BOX2

BOX1

BOX3

我无法将任何东西拖入Box2。 我在Firebug中没有任何错误。 什么都没发生。

例2

如果我上面的盒子顺序相同(Box1,Box2,Box3)并且我“隐藏”了Box2的内容,我就无法将任何内容拖入Box3。 如果我再次“显示”Box2,我可以拖入Box3而不是Box2 ……

如果我设置了以下框并隐藏Box3,我无法将任何内容拖入Box4和Box5。 如果我然后显示Box3,我唯一无法拖入的框是Box3:

BOX1

BOX2

BOX3

Box4

了Box5

你头脑中的任何想法? 我正在使用通常的可拖动和可排序的函数(由于某种原因使用droppable和sortable可以放弃两次可抛出的事件 – 这个论坛上另一个用户注意到的一种奇怪现象)。 我必须指出,当您启动此代码时,只加载了一个框,并单击按钮以创建新框。 这是一个构建新框的function,并将其设置为可拖动/可排序区域。

干杯:)

–update ————————-

我创建了一个简化的视图,使用了大多数’webdeveloperplus’代码(本章的巨大荣誉)。 它可以在这里找到:jsfiddle.net/gD94w/4(顺便说一下,我喜欢这个jsfiddle网站!)。 您应该能够复制我的问题(将“项目”拖动到蓝色区域)。 我想知道的任何想法! 谢谢。

我遇到了同样的问题,但我的代码略有不同。 我设法弄清楚jquery会记住sortable的位置,所以如果你移动它或改变它(通过切换或排序父元素),那么它将忘记它的位置。

解决方案是每次更改位置时刷新可排序。 在我的例子中,我将以下代码附加到父可排序的更新事件和我的切换:

$('.sortable-item').sortable('refresh'); 

更新:

我把Jsfiddle分成了一个新的: http : //jsfiddle.net/zf26q/

请注意添加内容:

 $('.draggedcontent').sortable('refresh'); update: function(event, ui){ $('.draggedcontent').sortable('refresh'); } 

我无法复制这个问题。 如果能解决您的问题,请告诉我。