如何使用javascript更改背景，使用下拉菜单

嗨即时通讯目前不是很棒的JavaScript和我遇到了问题。即时通讯制作一个网站炫耀我可以做什么，并在我将显示布局我想要的选项，使他们可以改变页面的颜色，看看它看起来像。现在我已经完成了这个使用单选按钮，它很好，但我想把它放到一个下拉，使其看起来更好。如何使用javascript更改背景，使用下拉菜单

与单选按钮的代码：

<form action=""> 
     <input onclick="change_color_body_blue()" type="radio" name="Content_body_color"/>Blue 
     <input onclick="change_color_body_green()" type="radio" name="Content_body_color"/>Green 
     <input onclick="change_color_body_red()" type="radio" name="Content_body_color"/>Red 
     <input onclick="change_color_body_yellow()" type="radio" name="Content_body_color"/>Yellow 
     <input onclick="change_color_body_orange()" type="radio" name="Content_body_color"/>Orange 
     <input onclick="change_color_body_purple()" type="radio" name="Content_body_color"/>Purple 
     <input onclick="change_color_body_brown()" type="radio" name="Content_body_color"/>Brown 
     <input onclick="change_color_body_cream()" type="radio" name="Content_body_color"/>Cream 
     <input onclick="change_color_body_pink()" type="radio" name="Content_body_color"/>Pink 
     <input onclick="change_color_body_hotpink ()" type="radio" name="Content_body_color"/>HotPink 
     <input onclick="change_color_body_black()" type="radio" name="Content_body_color"/>Black 
     <input onclick="change_color_body_white()" type="radio" name="Content_body_color"/>White 
    </form>

现在与下拉

 <form action=""> 
    <select> 
     <option onchange="change_color_body_blue()" name="Content_body_color">Blue</option> 
     <option onchange="change_color_body_green()" name="Content_body_color">Green</option> 
     <option onchange="change_color_body_red()" name="Content_body_color">Red</option> 
     <option onchange="change_color_body_yellow()" name="Content_body_color">Yellow</option> 
     <option onchange="change_color_body_orange()" name="Content_body_color">Orange</option> 
     <option onchange="change_color_body_purple()" name="Content_body_color">Purple</option> 
     <option onchange="change_color_body_brown()" name="Content_body_color">Brown</option> 
     <option onchange="change_color_body_cream()" name="Content_body_color">Cream</option> 
     <option onchange="change_color_body_pink()" name="Content_body_color">Pink</option> 
     <option onchange="change_color_body_hotpink ()" name="Content_body_color">HotPink</option> 
     <option onchange="change_color_body_black()" name="Content_body_color">Black</option> 
     <option onchange="change_color_body_white()" name="Content_body_color">White</option> 
    </select> 
    </form>

我已经平变化的onclick和ONSELECT尝试，但没有工作的代码我也开始加入的事件之一这个选择标签可以工作，但它只会变成1种颜色，因为只有我的一个功能可以输入任何人都可以看到解决方法？

来源

2014-01-16 Website_Crazy

这应该工作。

<html> 
<head> 
</head> 
<body> 
<select onchange="javascript:changeColor(this);"> 
     <option>Blue</option> 
     <option>Green</option> 
     <option>Red</option> 
     <option>Yellow</option> 
     <option>Orange</option> 
     <option>Purple</option> 
     <option>Brown</option> 
     <option>Cream</option> 
     <option>Pink</option> 
     <option>HotPink</option> 
     <option>Black</option> 
     <option>White</option> 
    </select> 
<script> 
function changeColor(el) { 
    var color = el.value; 
    document.body.style.background = color; 
} 
</script> 
</body> 
</html>

来源

2014-01-16 10:16:56 cardeol

感谢您的帮助，这工作！我可以问，什么埃尔代表，为什么“这个”需要在“changeColor（this）”我只是想了解即时通讯做什么：D –

好（这）意味着当前使用的对象，它是一个引用html DOM元素。 “el”只是接收函数传递的“this”的参数名称。 – cardeol

谢谢，我现在明白了，你刚刚为我节省了很多编码，我昨天花了整整一天的时间做单元格边框的单选按钮，等等，但这种方式更快更快捷：D –

如何使用javascript更改背景，使用下拉菜单

回答

相关问题