将项目从一个静态列表复制到另一个静态列表并还原
Copy Item from One static list to another and revert as well
我有两个列表。 ListOne
和 ListTwo
。 ListTwo
中有 1-5 个项目,想要将所需的项目拖到 ListOne
,初始为空白,该项目将添加到 ListOne
,但不会删除该项目来自 ListTwo
。我已经完成到这里了。
问题:当我想将项目从 ListOne
拖到 ListTwo
时,应将此项目从 ListOne
中删除,但不应将其添加到 ListTwo
。这没有发生。
简单来说,我希望 ListTwo 是静态的。
这是我的 fiddle link.http://jsfiddle.net/hQnWG/1596/
这是一个解决方案。我将 sortable1 连接到 sortable2 并在 sortable2 上使用接收处理程序以在项目移动时将其删除。
$(function() {
$("#sortable2").sortable({
connectWith: "#sortable1",
helper: function (e, li) {
this.copyHelper = li.clone().insertAfter(li);
$(this).data('copied', false);
return li.clone();
},
stop: function () {
var copied = $(this).data('copied');
if (!copied) {
this.copyHelper.remove();
}
this.copyHelper = null;
},
receive: function(e, ui){
$(ui.item[0]).remove();
}
});
$("#sortable1").sortable({
connectWith: "#sortable2",
receive: function (e, ui) {
ui.sender.data('copied', true);
}
});
$("#sortable1").on("click", "li", function () {
});
});
我有两个列表。 ListOne
和 ListTwo
。 ListTwo
中有 1-5 个项目,想要将所需的项目拖到 ListOne
,初始为空白,该项目将添加到 ListOne
,但不会删除该项目来自 ListTwo
。我已经完成到这里了。
问题:当我想将项目从 ListOne
拖到 ListTwo
时,应将此项目从 ListOne
中删除,但不应将其添加到 ListTwo
。这没有发生。
简单来说,我希望 ListTwo 是静态的。
这是我的 fiddle link.http://jsfiddle.net/hQnWG/1596/
这是一个解决方案。我将 sortable1 连接到 sortable2 并在 sortable2 上使用接收处理程序以在项目移动时将其删除。
$(function() {
$("#sortable2").sortable({
connectWith: "#sortable1",
helper: function (e, li) {
this.copyHelper = li.clone().insertAfter(li);
$(this).data('copied', false);
return li.clone();
},
stop: function () {
var copied = $(this).data('copied');
if (!copied) {
this.copyHelper.remove();
}
this.copyHelper = null;
},
receive: function(e, ui){
$(ui.item[0]).remove();
}
});
$("#sortable1").sortable({
connectWith: "#sortable2",
receive: function (e, ui) {
ui.sender.data('copied', true);
}
});
$("#sortable1").on("click", "li", function () {
});
});