在Javascript中保存切换元素和本地存储

我试图在我的Web应用程序中用一个重要的按钮切换元素

当元素淡入时，按钮中的文本将更改，当元素隐藏时，按钮中的文本将再次更改

这是一个！，我找到的

<div class="ISBody">
<h5>Header</h5>
<div class="ISTopLink"><a href="#ISTop">Return to Top</div>
<div class="ISHide"><a href="#" class="hideLink">Hide Products - </a></div>
<hr>
<div id="pos" style="display: block;">
  <div class="ISProductBody">
   <div class="ISSubHead"><A HREF="#">Prodcut Name</A></div>
  <div class="ISList">
   <ul>
    <li>Text here</li>
    <li>Text here</li>
    <li>Text here</li>
    <li>Text here</li>
  </ul>
  </div>
</div>
</div>

$(".hideLink").on("click", function(){
if($(this).text()=="Hide Products - ")
{
    $(this).text("Show Products - ");
} else {
    $(this).text("Hide Products - ");
}
$(".ISProductBody").toggle(); 

return false;
});

标题


此处文本
此处文本
此处文本
此处文本

$（.hideLink”）。在（“单击”，函数（）上{
如果（$（this）.text（）=“隐藏产品-”）
{
$（此）.text（“显示产品-”）；
}否则{
$（此）.text（“隐藏产品-”）；
}
$（“.ISProductBody”）.toggle（）；
返回false；
});

如何将更改后的状态保存到本地存储，以便在刷新页面时，页面不会进入第一个状态！与按钮或链接中显示/隐藏的元素和更改的文本类似

---

我感谢每一个提示或解决方案！干杯

只需使用

.setItem（）

将当前状态存储在

localStorage

中，然后在页面加载时获取当前状态并相应地执行操作

$（.hideLink”）。在（“单击”，函数（）{
如果（$（this）.text（）=“隐藏产品-”）{
$（此）.text（“显示产品-”）；
setItem（“隐藏”，true）；
}否则{
$（此）.text（“隐藏产品-”）；
setItem（“隐藏”，false）；
}
$（“.ISProductBody”）.toggle（）；
返回false；
});
$（文档）.ready（函数（）{
var hidden=localStorage.getItem（“隐藏”）；
如果（隐藏）{
$（“.hideLink”）.text（“展示产品-”）；
$（“.ISProductBody”）.toggle（）；
}
});

标题


此处文本
此处文本
此处文本
此处文本

我找到了问题的答案，效果非常好

给你

非常感谢你的帮助
 它只是将文本更改为另一个，刷新时它将进入下一个状态我相信
localStorage
在JSFIDLE中不起作用。你在自己的页面上尝试过吗？是的，我也在我的页面上尝试过，它将值设置为保存在localStorage中的值：（Sebastian Speitel）你测试过吗？如果它与你一起工作？js fiddle支持localStorage