관리자 사용자가 사이트에 로그인 할 때 표시되는 도구 팔레트가 있습니다. 팔레트는 draggable (jQueryUI.draggable을 통해)이며 페이지/새로 고침 사이의 위치를 기억하고 싶습니다.이 작업을 수행하는 표준 방법 또는 사용해야하는 플러그인이 있습니까? 나 자신을 굴려 라 (쿠키 또는 무언가를 통해)?페이지 새로 고침 사이의 jQuery 드래그 가능한 도구 팔레트 위치 기억하기
쿠키는 좋은 옵션이 있습니다 -이 같은 functions by PPK을 사용할 수 있습니다 :이 내 원래의 대답은하지만
$('#palette')
.css({ top: readCookie("palletteY")*1, left: readCookie("palletteX")*1 })
.draggable({ stop: function (event, ui) {
createCookie("palletteX", ui.position.left, 100);
createCookie("palletteY", ui.position.top, 100);
} });
필자는 플러그 - 인이나 표준을 잘 모르고 있지만 (어쩌면 존재할 수도 있음) 어쨌든 굉장히 복잡한 작업이 아닙니다. 쿠키는 쿠키를 완성하는 한 가지 방법입니다.
이 클라이언트 측 상태를 저장하는 기본 방법은 Ajax를 통해 서버에 새로운 상태를 전달하는 콜백 함수를 설정하는 것입니다. 그렇다면, 나는 그걸로 제발 할 수 있습니다. 일반적으로 세션에 저장 하겠지만, 특정 작업을 영구적으로 유지해야하고 세션에서 데이터베이스로 이동해야한다고 결정한 경우가 있습니다. 이 저장된 서버 측을 사용하면 쉽게 변경할 수 있습니다. Ajax 콜백을 통해 세션에 저장하고 pageload에서 검색하여 시작하는 것이 좋습니다.
쿠키가 좋은 해결책이라고 생각합니다. 심지어 jquery 쿠키 플러그인 here이 있습니다. stop event의 쿠키에 좌표를 저장할 수 있습니다. 페이지가 변경되면 쿠키가 있는지 확인할 수 있습니다. 그렇다면 드래그 가능한 CSS를 변경하십시오.
데이터베이스의 서버에 저장할 수 있지만 다소 과장된 것 같습니다. 스키마를 변경해야하기 때문입니다.
Kevin은 unload event을 사용하여 좌표를 저장하도록 제안했습니다. 이렇게하면 드래그가 중지 될 때마다 쿠키에 쓸 필요가 없습니다.
이것이 가장 단순하다고 생각합니다. ppk 코드에서 쿠키의 기본 설정이 주어 지지만, 약간의 주름이 있습니다. 팔레트는 위치를 사용하여 표시됩니다. 즉, 창 내용이 스크롤 될 때 고정되어 있습니다. * 작동하지 않으면 안됩니다 ;-) – Dycey
아주 이상합니다! ui.position은 올바른 값을 유지합니까? –
예 - 쿠키가 올바르게 저장되고 업데이트되었습니다. 그러나 페이지를 새로 고칠 때 팔레트는 여전히 기본 위치에로드됩니다. 코드가 실행되고 방화 벽이 스타일이 변경되었음을 보여줍니다. 아직 CSS가 남아 있으므로 오류가 발생합니다. 너에게 다시 돌아갈 게. – Dycey