Question

我有一个复选框，可以切换div，然后将选择注册到localstore并取回

但是我不能做的是切换div的javascript不会看到复选框的选项，它需要将其切换两次

index.html

<div id="siit" class="sit"></div>

Clock?: <br>
        <label class="switch">
          <input id="tetik" type="checkbox">
          <span class="slider round"></span>
        </label>

saat.js

function basla() {
  var today = new Date();
  var h = today.getHours();
  var m = today.getMinutes();
  var s = today.getSeconds();
  h = checkTime(h);
  m = checkTime(m);
  s = checkTime(s);
  document.getElementById('siit').innerHTML =
  h + ":" + m + ":" + s;
  var t = setTimeout(basla, 500);
}
function checkTime(i) {
  if (i < 10) {i = "0" + i};  // add zero in front of numbers < 10
  return i;
};

这是codepen：https://codepen.io/Etka/pen/BvGKWV

我想要这个：当用户选择显示时钟并离开时，当用户返回时，javascript将选中该复选框，如果选中则将显示时钟

Answer 1

在检查选定状态并选中复选框时，还要使时钟可见。

// Set the selected state
    if (isSaved === "true") {
      checkbox.checked = true;
      $("#siit").show();
    }

Answer 2

如果通过以下方法将复选框保存在LocalStorage中，请在display函数内将时钟div元素#siit的css "block"属性更改为init()：

if (isSaved === "true") {
  checkbox.checked = true;
}

对此：

if (isSaved === "true") {
  checkbox.checked = true;
  document.getElementById("siit").style.display = "block";
}

这是一个CodePen，上面有我从您的原始代码中派生的上述经过修改的代码：https://codepen.io/andrewl64/pen/LMXNgj?editors=0010

根据复选框的状态使用JavaScript

2 个答案: