在选择合并框

Question

我正在尝试开发一个具有以下功能的小页面：

• 每排有10行和3个盒子。
• 如果我选择2个或更多框或拖动框，则应合并。

例如，如果以下是我的第一个屏幕 然后我选择两个方框，然后结果如下

请参阅Fiddle

这里它只是第一次工作。我想保存状态，当我点击close按钮时它应该回滚到以前的状态。

请帮帮我。

Answer 1

请注意，您正在使用我提供给您的合并功能。

正如我告诉你的那样，代码只是解释了要遵循的一般方法。

还记得调用此函数使新元素可以删除：

var modifyAsDroppable = function(target) {
    var what = "<div class=\"handle ui-selectee\"><span class=\"ui-icon ui-icon-carat-2-n-s ui-selectee\"></span></div>";
    target.prepend(what);
}

在 this 版本中，我将每个任务划分为不同的功能，因此 merge（）变为：

var merge = function() {
    /* contains: top left bottom right */
    var properties = calculateSize();
    var $merged = createNewDiv();
    insert($merged, searchWhereInsert(properties));
    modifyAsDroppable($merged);
    setSize($merged, properties);
    removeMerged();
}

如果您希望它不仅可以在第一时间使用，那么您必须按照如何填充选定的数组的方式开展工作。

更新

在 this demo 中，我修复了“一次性工作”，现在总是有效。选定的数组创建存在错误，现在是：

if(index >= 0) {
  selected.push(index);
}

完成的工作越多，现在就自己提供“撤销”功能。

更新+ rollBack

在 this version 中，您有一个rollBack功能，但它有很多错误（在某些情况下不起作用）。
改善它！

更新+ rollBack fixed＆amp;＆amp;工作

仅为个人自我， HERE 工作rollBack。 （冷却！）