Question

我想在复选框中更改CSS中的身体颜色。怎么做？

HTML -

<label class="switch">
  <input type="checkbox">
  <span class="slider round"></span>
</label>

JavaScript - 这里要粘贴什么？

CSS - 这里要过去什么？

非常感谢！

Answer 1

好的，既然你是js的新手我已经评论了代码

HTML：

<body>
<p>
  test
</p>
<label class="switch">
  <input type="checkbox" id="test">
  <span class="slider round"></span>
</label>

JS：

var checkedColor="red"; //the colors of the background
var uncheckedColor="blue" //the colors of the background
document.body.style.backgroundColor =uncheckedColor;//change the color at the begining to keep it consistent
function changeColor(){

  if (document.getElementById("test").checked) { //if it is checked change to  checkedColor
      document.body.style.backgroundColor = checkedColor;
  } 
  else {//if it is not checked change to  uncheckedColor
     document.body.style.backgroundColor =uncheckedColor;
  }
}


document.getElementById("test").addEventListener('click', changeColor); //make the checkbox exeute the function test when being clicked

以下是一个工作示例：https://jsfiddle.net/25t64qha/

更改复选框上的正文颜色

1 个答案: