Question

我有不同大小的模块，我希望占位符与被拖动模块的大小相同，这是我到目前为止已经想到的......

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

我的问题是我试图在开始范围之外使用var“type”，但我无法想出任何其他方法。

如果有人想玩代码，我在这里设置了一个小提琴： http://jsfiddle.net/TfcQq/

Answer 1

根据jquery ui文档（http://jqueryui.com/demos/sortable/#placeholder），有一个占位符的setter。注意值中的空格，看起来像是一个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' );
});

如何根据jQuery UI Sortable中的拖动对象更改放置占位符？

1 个答案: