1

我正在处理一个包含图像而不是文本的选择框(在背景上使用 css)。

<script type="text/javascript">
function onChange(element) {
element.style.backgroundColor = "Yellow";
element.className = "on_change";
}
</script>



<select onchange="onChange(this);">
<option value="1" style="background: url(/one.png) no-repeat scroll 0 0 transparent; width:32px; height:32px;"></option>
<option value="2" style="background: url(/two.png) no-repeat scroll 0 0 transparent; width:32px; height:32px;"></option>
<option value="3" style="background: url(/three.png) no-repeat scroll 0 0 transparent; width:32px; height:32px;"></option>
</select>

问题是如何获取所选选项的值,如果是 1 设置一个图像,如果是两个,则使用纯 JavaScript(无 jQuery)将另一图像设置为背景?

我知道这selectedIndex是我的问题的关键,但我不知道如何使用它或如何在if else声明中使用它。

上面的脚本只是我的试验之一,我实际上使用上面的脚本来执行相同的任务。

<select onchange="this.style.backgroundColor=this.options[this.selectedIndex].style.backgroundColor; this.style.color=this.options[this.selectedIndex].style.color">
4

1 回答 1

1

这是工作示例。http://codebins.com/codes/home/4ldqpb9

您不需要 if else,只需根据 selectedIndex 更改背景图像。

function onChange(obj) {
    obj.style.backgroundImage = obj.options[obj.selectedIndex].style.backgroundImage
}
于 2012-07-07T03:09:18.020 回答