代碼展示三種 .sortable() 初始化方式,本質差異在於 選擇器匹配的元素集合不同,導致可拖拽範圍、連接目標不同。
| 寫法 | 選擇器 | 效果 |
|---|---|---|
| 1 | #div1、#div2、#div3 分別初始化 | 精細控制各容器連接關係,div3 僅接收不外拖 |
| 2 | #container 統一初始化,items:'p' | 所有 <p> 可在三欄間自由移動,dropOnEmpty 無效(因容器非 .column) |
| 3 | .column 統一初始化 | 三欄對等,均可拖拽互通,dropOnEmpty:false 可禁止空欄接收 |
refresh() 最便利僅當 connectWith 指向的容器選擇器匹配到空容器時生效。寫法 2 中 connectWith:'.column' 但初始化目標是 #container,故無效。