首页 > 解决方案 > 使用 type="color" 从输入中选择颜色时如何更改身体的背景

问题描述

我尝试添加一个 onclick 事件,当单击该事件时,会将背景更改为我的输入字段中设置的任何内容,但它不起作用。我不知道我是否使用了错误的事件,或者它是否是其他东西。有人可以帮我吗谢谢。

let color = document.getElementById("color-picker");

color.addEventListener("click", function() {colorPicker(color)});

    function colorPicker(chooseColor) {
        body.style.backgroundColor = chooseColor
    }
<fieldset>
            <legend>Appearing here</legend>
            <div>
                <label for="color-picker">Colors</label>
            </div>
            <div>
                <input type="color" id="color-picker">
            </div>
        </fieldset>

标签: javascripthtmlcss

解决方案


几个问题

  1. change应该使用事件而不是click
  2. 应该document.body代替body
  3. 应该chooseColor.value用来选择颜色选择器的值

推荐阅读