Question

我正在使用包含图像而不是文本的选择框（在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">

Answer 1

这是一个有效的例子。 http://codebins.com/codes/home/4ldqpb9

你不需要，除了根据selectedIndex更改背景图片。

function onChange(obj) {
    obj.style.backgroundImage = obj.options[obj.selectedIndex].style.backgroundImage
}

if if on javascript with a value box（纯javascript）

1 个答案: