攔截並替換丟棄在可排序列表上的項目

我有一個與可拖動列表相關聯的jQuery UI可排序列表。您可以將項目拖出可拖動列表並將其放在可排序列表中。這很好。攔截並替換丟棄在可排序列表上的項目

但是，我想攔截drop並徹底改變 - 實際上替換實際插入到可排序列表中的列表項。查看jQuery UI可排序的「更新」事件，我看到了各種方法來檢查被刪除的項目，但我無法弄清楚如何說「不要插入剛剛刪除的項目 - 插入此項目來代替。「

有沒有辦法做到這一點？如果不是，那麼處理這個用例的「最佳實踐」是什麼？我確信我不是第一個想要做這樣的事情的人。

2013-11-22 Josh

有可能是一個更好的解決方案，但是這可能會爲你的情況下工作：

$("#sortable").sortable({ 
    update: function (e, ui) { 
     var myElement = $("<li style='background-color: red'>" + $(ui.item).text() + "</li>"); 

     $(ui.item).replaceWith(myElement); 
    } 
});

觀看演示：http://jsfiddle.net/lhoeppner/Qt6Qw/

的元件插入後更新事件被調用，所以如果你真的需要爲防止這種情況發生，您可能需要攔截beforeStop event。你可以，例如防止插入這樣的：

$("#sortable").sortable({ 
    beforeStop: function() { 
     $(this).sortable('cancel'); 
    } 
});

然而，在這種情況下，原始的元素只是恢復，你就必須刪除它，然後手動揣摩出它會插入。

來源

2013-11-22 03:53:38

我實際上實現了一個不同的解決方案 - 我在拖動之前修改了origin元素 - 但這似乎是我問的問題的最佳答案，所以我接受了它。謝謝！ – Josh

我正在做同樣的事情，我發現最好的解決方案是使用停止事件。我之前嘗試過接收和更新事件，但結果並不理想。

停止事件的唯一缺點是它會被解僱，即使這些項目在他們自己之間排序。

來源

2013-12-12 06:40:57

攔截並替換丟棄在可排序列表上的項目

回答

相關問題