Chrome和Opera中的复选框切换

Checkbox toggle in Chrome and Opera

本文关键字:复选框 Opera Chrome      更新时间:2023-09-26

重现问题的步骤:

  1. 在浏览器"Settings"中,选择"On startup"下的"Continue where you/I left off"
  2. 导航到演示
  3. 选中复选框
  4. 编辑文本
  5. 关闭浏览器并重新打开。或者复制/克隆选项卡

现在,正如您所看到的,复选框已选中,但文本区域未着色
我在Windows 10的最新版本Chrome和Opera中尝试过。我不确定Safari,但它的行为可能也是如此。

问题:

  • 为什么会发生这种情况
  • 什么是跨浏览器解决方案

尝试

window.onload = function() {
  document.getElementById('colorsToggle').onchange = function() {
    document.getElementById('textField').classList.toggle('tan');
  }
  document.getElementById('textField').classList.toggle(document.getElementById('colorsToggle').checked ? "tan" : "white");
};