使用sessionstorage保存暗模式 | 使用sessionstorage保存暗模式

本文介绍了使用sessionstorage保存暗模式的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我已成功使用以下方式将暗模式添加到我的网站中这把小提琴

I successfully added dark mode to my site usingThis fiddle

JS:

$('#mode').change(function(){

if ($(this).prop('checked'))
{
    $('body').addClass('dark-mode');
}
else
{
    $('body').removeClass('dark-mode');
}
});

但是，刷新页面时，主题显然会切换回去.我找不到如何使用sessionstorage在域上保持暗模式的方法.

However, when refreshing the page the theme switches back obviously.I can't find out how to use sessionstorage to keep dark mode over the domain.

有人可以帮助我吗?谢谢！

Can someone help me?Thanks!

推荐答案

您可以使用本地存储来存储数据

You can use local storage for storing the data

function darkmode(){
    $('body').addClass('dark-mode');
    localStorage.setItem("mode", "dark");
    }



function nodark(){
        $('body').removeClass('dark-mode');
        localStorage.setItem("mode", "light");
        }

  if(localStorage.getItem("mode")=="dark")
        darkmode();
  else
    nodark();

$('#mode').change(function(){

    if ($(this).prop('checked'))
    {
        darkmode();
    }
    else
    {
        nodark();
    }

});

这篇关于使用sessionstorage保存暗模式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！