[英]jQuery draggable / sortable on dynamically-created elements
经过一番血,汗,幸运没有眼泪,我设法创造了一个符合我需要的拖放系统。
只有两件事几乎引发了我的眼泪......
这是jsfiddle
问题在于这些代码行,但无法找到它:
if (dropped === original) {
$("#dropzone").append('<li class="placeholder" data-id="" data-order="" data-content=""></li>');
init();
}
$(".remove").click(function() {
var removable = $(this).parent();
if (dropped > original) {
removable.remove();
removable.removeClass("dropped");
removable.removeClass("ui-droppable-disabled");
} else {
removable.empty();
removable.removeClass("dropped");
removable.removeClass("ui-droppable-disabled");
}
init();
});
所以现在解释和我的目标:
有5天,默认情况下,占位符将随着天数的增加而动态增加。 如果填充了占位符的最大限制,则将追加另一个。 现在,在附加了非默认占位符并删除之前填充的占位符后,我不能再允许它可以放置。
很难解释,但看到上面的演示^
额外 :我希望能够在这些占位符之间拖动项目。 但也找不到办法。
谢谢您的帮助!
您似乎没有重新激活删除时的droppable
。 而且,在drop
上destroy
它们可能会让你需要重新创建它们。 你可以使用disable
的下降和enable
时删除。 像这样:
drop: function (event, ui) {
var dragging = ui.draggable.clone().find("img").remove();
$(this).append(dragging).addClass("dropped");
$(this).droppable('disable');
然后:
if (dropped > original) {
$(this).parent().droppable('enable')
removable.remove();
removable.removeClass("dropped");
removable.removeClass("ui-droppable-disabled");
} else {
$(this).parent().droppable('enable');
removable.empty();
removable.removeClass("dropped");
removable.removeClass("ui-droppable-disabled");
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.