jQuery 및 HTML5 DOM 변경 UNDO 함수

Question

나는 여러 span을 드래그 할 수있는 컨테이너 div가 있습니다. 나는 그들을 위해 UNDO 함수를 만들고 싶다. 실행 취소 기능은 마지막 버전이라고하면 범위 속성이 변경 될 때

이

1. 은 (위치, CSS) 스크립트가
2. DOM에 변화가 HTML5 로컬 스토리지
3. 를 통해 저장되는 DOM의 변화를 감지 : 나는에서 생각하고 의 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 상태를 기록합니다 기본 로컬 스토리지의 코드가 있습니다. 경고는 localstorage에있는 것을 표시합니다. 아마도 여러 DOM 상태를 저장하고 변수에 넣어야합니다. 그 후 각 UNDO에서 하나의 변수를 삭제하는 중 ... 나는 이것이 이것을하는 방법이라고 확신하지 못합니다.

이 입력은 무엇입니까? 감사합니다.

Answer 1

먼저 코드에 중점을 둡니다. 나는 그것이 상당히 정확하다고 생각합니다. 결국 당신은 localStorage에 문자열을 넣고 다시 가져 오는 것입니다. 이제

, 몇 가지 생각 :

• "#container"의 "HTML"는 무엇인가요? 그것은 문자열의 단지 무리라면, 좋아. 그렇지 않으면 모든 "복원"할 때마다 DOM의 해당 분기를 다시 작성합니다. 이것이 "무겁거나"없는 경우 정확히 무엇을하고 있는지 판단 할 수 있습니다.
• 왜 localStorage를 사용하고 싶습니까? localStorage의 내용은 브라우저가 생성 된 로컬입니다. 즉, 사용자가 다른 브라우저 인스턴스에서 동일한 페이지를 열면 UNDO 기능이 "가능하지 않음"을 의미합니다.
• 브라우저의 기본 UNDO로 충분하지 않습니까? 하지만 난 알아 맞추기, 나는 당신이 단순히 일부 포함 물건을 취소하지 않은 가정 "< 입력 유형 ="텍스트 "/ >"또는 "< 텍스트 영역/>"

당신이 "스택"을 구현하는 건가요 실행 취소 할 수있는 작업은 무엇입니까? 그렇게하면 멋지다;)