如何根據jQuery UI Sortable中的拖動對象更改拖放佔位符？

Question

我有不同大小的模塊，我想佔位符是被拖動模塊的大小相同的，這是我迄今想通了......

$("#col1, #col2, #col3").sortable({ 
    connectWith: ".col", 
    start: function(event, ui) { 
    var type = ui.item.hasClass("double") ? " double": ""; 
    }, 
    placeholder: "module drop" + type 
}).disableSelection(); 

我的問題是我m試圖在開始範圍之外使用var「type」，但我無法想出任何其他方式來做這件事。

如果有人想玩弄的代碼，我已經在這裏建立了一個小提琴： http://jsfiddle.net/TfcQq/

Answer 1

根據jQuery UI的文檔（http://jqueryui.com/demos/sortable/#placeholder），有一個佔位符的制定者。 請注意值中的空格，看起來像是一個css類。

所以，你可以嘗試：

$("#col1, #col2, #col3").sortable({ 
    connectWith: '.col' 
}).disableSelection(); 

$(".module").mouseover(function(){ 
    $("#col1, #col2, #col3").sortable("option", "placeholder", 'drop-single'); 
}); 

$(".module.double").mouseover(function(){ 
    $("#col1, #col2, #col3").sortable("option", "placeholder", 'drop-double'); 
});