javascript div 보이기 숨기기 질문입니다.
본문
<script type="text/javascript">
jQuery('#toggle').click(function () {
if($("#bo_list").css("display") == "none"){
jQuery('#bo_list').css("display", "block");
}
});
</script>
toggle 속성을 게시판 검색버튼과 연동해서 검색버튼을 클릭했을경우만 게시판리스트가 나오도록하고싶은데. 검색버튼을 누르니 페이지가 새로고침되면서 리스트가 잠깐보였다 다시 block 상태로 되네요.
유지방법없을까요?
답변 4
<button id="toggle">toggle</button>
<div id="bo_list" style="display:block">bo_list</div>
<script type="text/javascript">
$(document).ready(function() {
$('#toggle').click(function() {
if ($("#bo_list").css("display") == "none") {
$('#bo_list').css("display", "block");
localStorage.setItem("bo_list", "block");
}
else{
$('#bo_list').css("display", "none");
localStorage.setItem("bo_list", "none");
}
console.log("set: " + $('#bo_list').css("display"));
});
var display = localStorage.getItem('bo_list');
($("#bo_list").css("display", display));
console.log("get: " + display);
});
</script>
감사합니다 한번에 해결됬습니다 ^^
혹시 여기에 페이지가 빠져나가면 초기화 어떻게하나요? 다른메뉴갔다와도 열린상태가 유지되네요 ;; ㅎㅎ;;
요렇게 수정해서 해결했습니다 ^^ 너무너무 감사합니다.
<script type="text/javascript">
$(document).ready(function() {
$('#toggle').click(function() {
if ($("#bo_list").css("display") == "block") {
$('#bo_list').css("display", "block");
localStorage.setItem("bo_list", "block");
}
else{
$('#bo_list').css("display", "block");
localStorage.setItem("bo_list", "block");
}
});
var display = localStorage.getItem('bo_list');
($("#bo_list").css("display", display));
console.log("get: " + display);
localStorage.clear('bo_list');
});
</script>
이렇게 한번 해보세요..
<script type="text/javascript">
jQuery('#toggle').click(function () {
if($("#bo_list").css("display" == "none"){
jQuery('#bo_list').css("display", "");
}
});
</script>
안되네요 ^^;;
1. cookie 사용
2. url에 get으로 넘김
3. localStorage 사용
cookie 를 시도해봤는데 사용법을 잘모르겠습니다 ;; ㄷㄷ get은 검색 샷버튼 연동되는부분이라 찾기가 쉽지않네요. 3번은 잘모르겠습니다 ㄷㄷㄷ
아마 검색 버튼을 누르면 폼을 전송해서 검색을해서 다시 보여주는 것 같은데 그래서 새로 고침한 것 처럼 보이는 거 같네요.
검색 폼에 hidden 하나 추가하시고 검색 폼을 submit 하기 전에 채워서 같이 보내시고 화면 로딩시 그 변수를 확인해서 보이게 하시면 될 것 같네요
