溫馨提示×

js sortable有拖拽回調(diào)函數(shù)嗎

js
小樊
81
2024-10-23 00:45:03
欄目: 編程語言

在 JavaScript 中，Sortable.js 是一個非常流行的拖放庫，它提供了豐富的 API 來實現(xiàn)拖拽功能。其中一個重要的特性就是支持拖拽回調(diào)函數(shù)。

當(dāng)拖拽開始時（即用戶按下鼠標(biāo)并開始拖動元素），Sortable.js 會觸發(fā)一個名為 onUpdate 的回調(diào)函數(shù)。這個函數(shù)會在元素的位置發(fā)生變化時被調(diào)用，允許你在拖拽過程中執(zhí)行自定義的邏輯。

以下是一個簡單的示例，展示了如何在 Sortable.js 中使用 onUpdate 回調(diào)函數(shù)：

const sortable = new Sortable(el, {
  onUpdate: function(event) {
    console.log('Element position has changed:', event.oldIndex, '->', event.newIndex);
    // 在這里執(zhí)行你的自定義邏輯
  }
});

在上面的示例中，el 是你要進行拖拽操作的元素的選擇器。onUpdate 回調(diào)函數(shù)會在元素位置發(fā)生變化時被調(diào)用，并接收一個包含事件信息的對象作為參數(shù)。你可以通過 event.oldIndex 和 event.newIndex 來獲取元素在拖拽前后的索引，從而執(zhí)行相應(yīng)的邏輯。

除了 onUpdate 回調(diào)函數(shù)外，Sortable.js 還提供了其他許多回調(diào)函數(shù)，如 onStart、onEnd 等，以支持拖拽過程中的不同階段。你可以查閱 Sortable.js 的官方文檔以獲取更多關(guān)于回調(diào)函數(shù)的信息和使用示例。

0 踩