Question

我希望将对象的背景色更改为input type color（颜色选择器）中的值。当您单击该对象时。到目前为止，这就是我的想法。

GetColor(id)
        {
            document.getElementById(id).style.backgroundColor = document.getElementById("Color Picker").value;
        }

<div style="background-color:black; outline-color:black; outline-width:2px; width:500px; height:500px;"  id="ExtentionBody" onclick="GetColor('ExtentionBody')"></div>
        <div><input name="Color Picker" type="color" id="Color Picker"/></div>

Answer 1

在您的Javascript代码中，缺少关键字function，因此无法调用GetColor。添加此关键字后，效果很好：

function GetColor(id)
{
document.getElementById(id).style.backgroundColor = 
    document.getElementById("Color Picker").value;
}

<div style="background-color:black; 
        outline-color:black; 
        outline-width:2px; 
        width:500px; 
        height:100px;"  
     id="ExtentionBody" 
     onclick="GetColor('ExtentionBody')">
</div>
<div><input name="Color Picker" type="color" id="Color Picker"/></div>

如何基于颜色选择器值onclick更改元素颜色

1 个答案: