jQuery嵌套排序跳動行爲

我想允許用戶拖放UI元素。我有'容器'和'控制'，控制可能在容器中，容器可能包含其他容器（這是重要的要求）。我使用jQuery創建了簡單的原型。jQuery嵌套排序跳動行爲

HTML：

$('.one').sortable({ 
    items: 'div.control', 
    placeholder: 'placeholder', 
    forcePlaceholderSize: true 
});

現在，當我試圖拖動「子控件8」，並將其放置子控件2之間」：

<div class="one"> 
<div class="control">Control 1</div> 
<div class="control">Control 2</div> 
<div class="control container"> 
    Container drag area 
    <div class="control">Subcontrol 1</div> 
    <div class="control">Subcontrol 2</div> 
    <div class="control">Subcontrol 3</div> 
    <div class="control">Subcontrol 4</div> 
    <div class="control">Subcontrol 5</div> 
    <div class="control">Subcontrol 6</div> 
    <div class="control">Subcontrol 7</div> 
    <div class="control">Subcontrol 8</div> 
    <div class="control">Subcontrol 9</div> 
</div> 
<div class="control">Control 3</div>

然後我使用jQueryUI的創建sortables 「和」Subcontrol 3「，例如我收到跳動效果，你可以在這裏觀察它：

http://jsbin.com/egipu4/2

有趣的是 - 當我刪除拖拽「容器」的能力，然後它變得平滑和完美（你可以在jsbin例子下看到「jumpy」例子，你不能使用「容器拖拽區域」跨度）。我嘗試了不同的「嵌套」插件和技術，谷歌很長一段時間，唯一的工作是在這個頁面上：（StackOverflow不允許我發佈多個類似的谷歌「Brian Swartzfager的博客：嵌套列表排序演示「應該是第一個，對不起！）

但它確實工作很好，只有在jQuery1.2和非常古老的jQueryUI。如果我包含最新的jQuery（1.3/1.4）和UI（1.7/1.8），它也會變得很麻煩。我究竟做錯了什麼？

來源

2010-04-23 sebbie

的情況下，你仍然有興趣，我最近developed a plugin這使得與最新的jQuery和jQuery UI

來源

2010-09-14 21:02:32 mjsarfatti

感謝mjsarfatti嵌套排序的工作，你的插件是偉大的，我已經在使用它。有一些小問題，我正在進行修復，並將我的建議更改發佈到您的插件牆上。 – sebbie 2010-12-31 10:33:15

jQuery嵌套排序跳動行爲

回答

相關問題