如何使用 cookie 运行 "oneClick"
How to use cookies to run "oneClick"
我的网站有两个主要特点:首先它支持黑暗模式 with/and 没有 macOS/iOS(网站上有一个切换),我使用不同的选项卡 javascript 作为网站的翻译。现在我想有这个功能,save/get一个cookie,它首先保存是否手动切换暗模式并保存最后点击的语言,因为当你来到一个新页面时,暗模式应该打开或关闭,最后选择的语言应该出现。
我已经在 javascript 中为 cookie 尝试过一般的 get/save-functions,但我不知道如何将它们准确地应用到我的代码中。
那是我的实际 script.js,没有 cookie 功能:
function openCity(evt, langName) {
// Declare all variables
var i, tabcontent, tablinks;
// Get all elements with class="tabcontent" and hide them
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
// Get all elements with class="tablinks" and remove the class "active"
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
// Show the current tab, and add an "active" class to the button that opened the tab
document.getElementById(langName).style.display = "block";
evt.currentTarget.className += " active";
}
document.getElementById("index").click();
//Darkmode
$('#mode').change(function(){
var os2 = new Audio('../images/os2.mp3');
var dmmodus = new Boolean([false])
if ($(this).prop('checked'))
{
$('body').addClass('dark-mode');
os2.play();
}
else
{
$('body').removeClass('dark-mode');
}
});
//kontakt
document.getElementById('options').onchange = function() {
var i = 1;
var myDiv = document.getElementById(i);
while (myDiv) {
myDiv.style.display = 'none';
myDiv = document.getElementById(++i);
}
document.getElementById(this.value).style.display = 'block';
};
改用localStorage。仅当您需要将设置传达给后端时才需要 Cookie
试试这个
$('#mode').on("change",function() {
var darkMode = $(this).prop('checked');
localStorage.setItem("mode",darkMode?"dark":"")
$('body').toggleClass('dark-mode',darkMode);
if (darkMode) {
new Audio('../images/os2.mp3').play();
}
}).prop("checked",localStorage.getItem("mode") == "dark")
.change(); // initialise from localStorage
我的网站有两个主要特点:首先它支持黑暗模式 with/and 没有 macOS/iOS(网站上有一个切换),我使用不同的选项卡 javascript 作为网站的翻译。现在我想有这个功能,save/get一个cookie,它首先保存是否手动切换暗模式并保存最后点击的语言,因为当你来到一个新页面时,暗模式应该打开或关闭,最后选择的语言应该出现。
我已经在 javascript 中为 cookie 尝试过一般的 get/save-functions,但我不知道如何将它们准确地应用到我的代码中。
那是我的实际 script.js,没有 cookie 功能:
function openCity(evt, langName) {
// Declare all variables
var i, tabcontent, tablinks;
// Get all elements with class="tabcontent" and hide them
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
// Get all elements with class="tablinks" and remove the class "active"
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
// Show the current tab, and add an "active" class to the button that opened the tab
document.getElementById(langName).style.display = "block";
evt.currentTarget.className += " active";
}
document.getElementById("index").click();
//Darkmode
$('#mode').change(function(){
var os2 = new Audio('../images/os2.mp3');
var dmmodus = new Boolean([false])
if ($(this).prop('checked'))
{
$('body').addClass('dark-mode');
os2.play();
}
else
{
$('body').removeClass('dark-mode');
}
});
//kontakt
document.getElementById('options').onchange = function() {
var i = 1;
var myDiv = document.getElementById(i);
while (myDiv) {
myDiv.style.display = 'none';
myDiv = document.getElementById(++i);
}
document.getElementById(this.value).style.display = 'block';
};
改用localStorage。仅当您需要将设置传达给后端时才需要 Cookie
试试这个
$('#mode').on("change",function() {
var darkMode = $(this).prop('checked');
localStorage.setItem("mode",darkMode?"dark":"")
$('body').toggleClass('dark-mode',darkMode);
if (darkMode) {
new Audio('../images/os2.mp3').play();
}
}).prop("checked",localStorage.getItem("mode") == "dark")
.change(); // initialise from localStorage