密码登录显示Div localstorage

Question

有什么方法可以让本地存储在登录成功时始终显示“Lorem ipsum”div 的内容吗？

这样，当有人正确输入密码时，内容将始终可见，并存储在本地存储中，如果也可以隐藏密码字段和登录按钮...

到目前为止我所取得的成就：

    jsfiddle.net/thvinic/697bcq2t/1

示例中的密码是12345

请帮助我！ 谢谢您的帮助！

Answer 1

我认为从这个问题来看，您希望在成功“登录”后检查 localStorage 中 div 中的值。如果是这种情况，当您点击 if 语句时，您可以使用 localStorage api setItem() 将 hideValue 设置到 localStorage

     // No need to add a "show" class. Just remove the "hidden" class.
     div.classList.remove('hidden');
     localStorage.setItem('hiddenValue', div.innerHTML);

要检查页面加载时是否已使用此本地存储变量“登录”，您可以设置一个小函数来调用以检查本地存储项，并执行您需要的任何逻辑（隐藏输入和按钮并显示 div）

function setupPage() {
  if (localStorage.getItem('hiddenValue')) {
    input.classList.add('hidden');
    btn.classList.add('hidden');
    div.classList.remove('hidden');
  }
}

您可以在 JS 文件的底部调用它。如果需要清除localStorage，可以手动调用localStorage.clear()。有关 localStorage api 的更多信息，您可以在这里查看：https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage