Question

我正在尝试在我的代码中实现Dark / Light主题切换器。我有切换台工作，但现在需要在用户设置主题时设置/交换cookie。

这是我的代码

$(document).ready(function()
{
    $(".light-theme").click(function()
    {
        $("body").removeClass();
        $(this).addClass("current");
        $(".dark-theme").removeClass("current");
        $(".light-theme a i").removeClass("icon-circle").addClass("icon-circle-ticked");
        $(".dark-theme a i").removeClass("icon-circle-ticked").addClass("icon-circle");
        $.removeCookie('dark-theme'), { path: '/' };
        $.cookie('theme', 'light-theme', { expires: 365, path: '/' });
    })
});
$(document).ready(function()
{
    $(".dark-theme").click(function()
    {
        $("body").removeClass().addClass('dark');
        $(this).addClass("current");
        $(".light-theme").removeClass("current");
        $(".dark-theme a i").removeClass("icon-circle").addClass("icon-circle-ticked");
        $(".light-theme a i").removeClass("icon-circle-ticked").addClass("icon-circle");
        $.removeCookie('light-theme', { path: '/' });
        $.cookie('theme', 'dark-theme', { expires: 365, path: '/' });
    })
});
$(document).ready(function()
{
if ($.cookie('theme')=='dark-theme') {
    $('body').removeClass().addClass('dark');
    $(".light-theme").removeClass("current");
        $(".dark-theme a i").removeClass("icon-circle").addClass("icon-circle-ticked");
        $(".light-theme a i").removeClass("icon-circle-ticked").addClass("icon-circle");
}

if ($.cookie('theme')=='light-theme') {
    $('body').removeClass().addClass('light');
    $(".dark-theme").removeClass("current");
        $(".light-theme a i").removeClass("icon-circle").addClass("icon-circle-ticked");
        $(".dark-theme a i").removeClass("icon-circle-ticked").addClass("icon-circle");
}
    });

它在桌面上运行良好但在移动设备上运行不正常。如果我选择黑暗主题，它根本不会粘在一起并在刷新时重置为默认值。

为主题切换器设置cookie

0 个答案: