HTML
<a href="javascript:;" class="mdui-btn mdui-btn-icon" mdui-tooltip="{content: '切换模式'}" onclick="switchNightMode()"><i class="mdui-icon material-icons">wb_sunny</i></a>
JS
<script>
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
var expires = "expires=" + d.toGMTString();
document.cookie = cname + "=" + cvalue + "; " + expires;
}
function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i].trim();
if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
}
return "";
}
function switchNightMode() {
var mode = getCookie("mode");
if (mode == 'light' | mode == '') {
document.body.classList.add('mdui-theme-layout-dark');
setCookie("mode", "night", 30);
// document.cookie = "mode=night";
console.log('夜间模式开启');
} else {
document.body.classList.remove('mdui-theme-layout-dark');
setCookie("mode", "light", 30);
// document.cookie = "mode=light"
console.log('夜间模式关闭');
}
}
</script>
上面的代码实现的功能是 当我点击按钮,切换模式,比如说从正常模式切换到夜间模式.
现在问题出现了,当我点击这个按钮,可以切换到夜间模式, 却无法从夜间模式切换到正常模式.
控制台始终输出的结果是"夜间模式开启".
我开始还以为是我的 JS 代码里面设置 cookie 和获取 cookie 这部分代码写错了,后来又检查了很多遍,没有发现问题出现在哪里,麻烦各位大佬指点一下
这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。
V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.