jQuery et HTML5 Changement DOM Fonction UNDO

Question

J'ai un conteneur div dans lequel plusieurs plages sont déplaçables. Je veux construire une fonction UNDO pour eux. Je pense à:

1. lorsque les attributs de portée sont modifiés (position, css) le script détecte un changement DOM
2. le changement DOM est stocké via HTML5 localStorage
3. Lorsque la fonction UNDO est appelée la dernière version du DOM remplacer le courant.

J'ai le code localStorage de base qui enregistre le dernier état 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 

}); 
}); 

dès maintenant ce code ne prend que les DOM actuel et le stocke. L'alerte affiche ce qui est dans le localstorage. Je devrais probablement essayer de stocker plusieurs états DOM et les mettre dans des variables. Après cela, sur chaque UNDO, pour supprimer une variable ... Je ne suis pas sûr que ce soit la façon de le faire.

Des entrées sur celui-ci? Merci

Answer 1

D'abord, en mettant l'accent sur votre code: Je pense que c'est assez correct et que ça devrait faire l'affaire. Après tout, vous mettez simplement une chaîne dans le localStorage et vous le récupérez.

Maintenant, quelques réflexions:

• Quel est le "html" de "#container"? Si c'est juste un tas de ficelles, d'accord. Sinon, à chaque "restauration" vous reconstruisez cette branche du DOM. Si c'est "lourd" ou pas, c'est à quoi exactement faites-vous.
• Pourquoi voulez-vous utiliser localStorage? Ce qui est dans le localStorage est local au navigateur dans lequel il est créé. Cela signifie que votre fonctionnalité UNDO ne sera pas "possible" si les utilisateurs ouvrent la même page à partir d'une autre instance de navigateur.
• Etes-vous sûr que le défaut UNDO du navigateur ne vous suffit pas? Mais je suppose que non, et je suppose que vous êtes pas défait des choses qui implique simplement une « type d'entrée < = » text «/> « ou » < textarea/> »

que vous allez mettre en œuvre une « pile » des opérations de l'ONUDI? Si vous faites cela, ce serait cool;)