如何制作改变背景颜色的下拉菜单

Question

我试过制作一个下拉菜单来改变页面背景颜色，但它不起作用。有什么建议吗？

<body>

<select name="colors" onechange="changeColors(this)">
    <option value="blue">Blue</option>
    <option value="#868B8E">Grey</option>
    <option value="#FFC55C">Orange</option>
</select>

<script src="images8.js"></script>
</body>

js

function changeColor(event)
{
    var color = event.value;
    document.getElementsByTagName('BODY')[0].style.backgroundColor=color;
    
}

Answer 1

更正拼写错误后，您的代码运行良好：

onechange -> onchange

changeColors(this) -> changeColor(this)

查看工作片段

您可能想要添加一个 onload 事件以使用默认颜色开始。

function changeColor(event)
{
    var color = event.value;
    document.getElementsByTagName('BODY')[0].style.backgroundColor=color;
    
}

<select name="colors" onchange="changeColor(this)">
    <option value="blue">Blue</option>
    <option value="#868B8E">Grey</option>
    <option value="#FFC55C">Orange</option>
</select>

Answer 2

您的代码中有几个错别字：

函数调用是“changeColors”，但函数名称是“changeColor”。

此外，正确的事件名称是“onchange”而不是“onechange”

如何制作改变背景颜色的下拉菜单

how to make a pull down menu which chnages background color

html

javascript

colors

background-color