jQuery和HTML5 DOM更改UNDO函數

我有一個容器div，其中幾個跨度是可拖動的。我想爲他們建立一個UNDO功能。我在想：jQuery和HTML5 DOM更改UNDO函數

當跨度屬性被更改（位置，CSS）的腳本檢測到DOM變化
DOM的變化是通過HTML5的localStorage
存儲當UNDO函數被調用的最後一個版本的DOM替換當前。

我有基本的localStorage的代碼，將記錄最近的DOM狀態：

$('#undo').live('click', function() { 

var testObject = $('#container').html(); 

// Put the object into storage 
localStorage.setItem('testObject', JSON.stringify(testObject)); 

// Retrieve the object from storage 
var retrievedObject = localStorage.getItem('testObject'); 

alert(retrievedObject); 
// retrievedObject should now replace the current DOM 

}); 
});

現在這個代碼只需要當前的DOM，並將其存儲。該警報顯示本地存儲中的內容。我應該嘗試存儲幾個DOM狀態並將它們放入變量中。之後，在每個UNDO上，刪除一個變量... 我不確定這是如何做到的。

對此有何建議？謝謝

來源

2010-03-10 Mircea

首先，關注你的代碼：我認爲這是相當正確的，它應該完成這項工作。畢竟你只是在localStorage中放入一個字符串並將其取回。

現在，一些想法：

什麼是「#container的」的「HTML」？如果它只是一串字符串，好吧。否則，在每一個「恢復」你正在重建該DOM的分支。如果這是「沉重的」，這取決於你到底在做什麼。
爲什麼要使用localStorage？本地存儲中的內容在其創建的瀏覽器中是本地的。這意味着如果用戶從另一個瀏覽器實例打開相同的頁面，則您的UNDO功能將不可用。
您確定瀏覽器的默認UNDO對您來說不夠嗎？但我想不會的，我以爲你不是撤銷的東西，只是涉及到一些「<輸入類型=」文本「/ >‘或’<的textarea/>」

你要實現一個‘堆棧’ UNDO-capable的操作？如果你這樣做會很酷;）

來源

2010-03-10 17:42:47 Detro

在#container中將會有一些跨度可以由用戶修改（位置，顏色，大小）。這不會很「沉重」。我想使用localStorage，因爲它比服務器Ajax更快。我對真正的本地存儲功能不感興趣，在交叉表中工作，只是想用它作爲存儲空間。我不知道瀏覽器的任何默認UNDO。如果我可以設法創建一系列變量，那麼是的，該函數將有一堆撤消。 – Mircea

我知道你不想使用「服務器」Ajax，但是你的意圖是「UNDO」的可能性是否是特定瀏覽器的本地特性？ – Detro

jQuery和HTML5 DOM更改UNDO函數

回答

相關問題