Javascript保持div在页面刷新时切换 [英] Javascript keep div toggled on page refresh

问题描述

我尝试在提交表单或刷新页面时在登录/注册表单上保留一个div。

如何使用cookie.js记住已切换的div并在提交表单或刷新页面时保持切换？

 < a id =myHeader1href =javascript：showonlyone（'newboxes2'）;>登录< ; / a> 
< a id =myHeader2href =javascript：showonlyone（'newboxes3'）;>注册< / a> 
 
< div class =newboxesid =newboxes1style =display：block> 
默认图片
< / div> 
 
< div class =newboxesid =newboxes2style =display：none> 
登录框
< / div> 
 
< div class =newboxesid =newboxes3style =display：none> 
注册表框
< / div> 
  

和

 < script type =text / javascriptsrc =https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js>< / script> 
< script type =text / javascript> 
 function showonlyone（thechosenone）{
 $（'。newboxes'）每个（函数（索引）{
 if（$（this）.attr（id）== thehoshosone） {
 $（this）.show（200）; 
} 
 else {
 $（this）.hide（600）; 
} 
} ）; 
} 
< / script>感谢您的帮助！
 
 
 
 < >解决方案
 我更新了答案。 
 
 
 
  启用Cookie的现场演示  
 
 
 
  禁用Cookie的实时演示  
 在加载时，您会看到默认图片。 
在button1上点击，你看到登录。 
在button2上点击，你看到寄存器。 
，它在刷新页面（cookie设置）时也是一样的
  
 
I am trying to keep a div toggled on a login/register form when the form is submitted or when the page is refreshed. 

How do I use cookie.js to remember the div that was toggled and keep it toggled when the form is submitted or when the page is refreshed?
<a id="myHeader1" href="javascript:showonlyone('newboxes2');">Login</a>
<a id="myHeader2" href="javascript:showonlyone('newboxes3');">Register</a>  

<div class="newboxes" id="newboxes1" style="display: block">
  default image
</div>

<div class="newboxes" id="newboxes2" style="display: none"> 
 login box
</div>

<div class="newboxes" id="newboxes3" style="display: none"> 
register box
</div>          
And 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
function showonlyone(thechosenone) {
$('.newboxes').each(function(index) {
    if ($(this).attr("id") == thechosenone) {
         $(this).show(200);
    }
    else {
         $(this).hide(600);
    }
});
}
</script>
Thank you for your help!
解决方案
I updated the answer.

live demo with cookies enabled

live demo with cookies disabled
on load, you see the default picture.
on button1 click, you see the login.
on button2 click, you see the register.
and it appears the same way when you refresh the page (cookie setup)


                        
这篇关于Javascript保持div在页面刷新时切换的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！