当范围类型的输入值更改时更改正文的背景颜色答案

【问题标题】：Change the background color of body when value of input with type of range is change当范围类型的输入值更改时更改正文的背景颜色
【发布时间】：2019-09-19 01:56:00
【问题描述】：

我有一个范围类型的输入。当输入范围的值发生变化时，我想改变正文的背景颜色。

这里是 HTML

<div class="range">
    <input type="range" min="1" max="100" value="0" class="slider" id="myRange">
</div>

这里是 Javascript 代码

let slider = document.getElementById("myRange");
slider.onchange = () => {
    document.body.style.background = `linear-gradient(90deg,  #2b2e43 0%,#2b2e43 50%,#ffffff 50.1%,#ffffff 100%);`
}

【问题讨论】：

给<input>的值应该和梯度的值对应吗？
没有。只需简单地更改背景颜色。无论输入的值是什么
请检查您的来源，可能只是语法错误。错误也会在浏览器的DevTools 中查看。

标签： javascript html css

【解决方案1】：

我稍微修改了一下，但基本上主要问题是您在 JS 代码中的值中添加了一个分号，这不是必需的。

  function updateSlider() {
      document.body.style.background = `linear-gradient(90deg,  #2b2e43 0%,#2b2e43 50%,#ffffff 50.1%,#ffffff 100%)`;
 
  }

<div class="range">
    <input type="range" min="1" max="100" value="0" class="slider" id="myRange" onchange="updateSlider()">
</div>

【讨论】：