基于另一个div的状态显示/隐藏div而不刷新页面

Question

我想根据div的状态显示/隐藏'link2'。如果它打开，隐藏link2，如果它关闭，则显示link2。

link1和link2都会触发关闭或打开面板div。 因为我使用会话来记住div的状态，所以我希望显示相应的链接。

http://jsfiddle.net/9kUA5/

$('#panel').toggleClass('hidden', sessionStorage.getItem('form_visible') != 'true'); 
$('#flip, #flip_slip').click(function() { 
    $('#panel').slideToggle('slow', function() { 
     $(this).toggleClass('hidden'); 
    }); 
    sessionStorage.setItem('form_visible', $('#panel').hasClass('hidden')); 
}); 
$('#flip_slip')[ $('#panel').is(':visible') ? "hide" : "fadeIn" ](); 

HTML：

<div id="panel"> 
    test 
    <div id="flip">link1</div>   
</div> 
<div id="flip_slip">link2</div> 

编辑：

例如，如果我点击链接1 - >面板DIV变淡瓯 - >链接2自会话保存出现 面板div的状态，在页面刷新时，链接2应该是可见的

Answer 1

Demo Fiddle具有相当简化的代码。
jQuery代码

$(function() { 
    if(sessionStorage.getItem('form_visible')===null){ 
     sessionStorage.setItem('form_visible', 'false');//initiate it for the first time 
    }; 
    checkSessionStorage(); //call it to change the #panel display 

    $('#flip_slip,#flip').click(function() { 
     sessionStorage.setItem('form_visible', (sessionStorage.getItem('form_visible') == 'false' ? 'true' : 'false')); //change the sessionStorage 
     checkSessionStorage(); //call it to change the #panel display 
    }); 
    function checkSessionStorage() { 
     if (sessionStorage.getItem('form_visible') == 'true') { 
      $('#panel').slideDown(); 
      $('#flip_slip').fadeOut(); 
     } else { 
      $('#panel').slideUp(); 
      $('#flip_slip').fadeIn(); 
     } 
    } 
});