Javascript 无法在中更改背景色

当我将onClick放入时，脚本工作，但当我将其放入选项时，它不工作

以下是HTML选择脚本：

下面是JavaScript：

<script>
    function ship(num, pos) {
        if (num == 0){
            document.getElementById(pos).style.backgroundColor="white";
        }
        if (num == 1){
            document.getElementById(pos).style.backgroundColor="red";
        }
        if (num == 2){
            document.getElementById(pos).style.backgroundColor="green";
        }
        if (num == 3){
            document.getElementById(pos).style.backgroundColor="blue";
        }
        if (num == 4){
            document.getElementById(pos).style.backgroundColor="yellow";
        }



    }

</script>

onclick-on选项在大多数浏览器上都不起作用，或者可能一个浏览器都不起作用，相反，您可以根据select-and-switch的value属性侦听其更改事件

你可以这样做：

var color = [
    "white",
    "red",
    "green",
    "blue",
    "yellow"];

window.onload = function () {
    document.getElementById('selectId').onchange = function () {
        this.style.backgroundColor = color[this.value];
    }
}

---

对于选项，onClick有时可能不起作用。因此，最好将onChange函数放在select标记中，并传递所选子元素的值。

您应该在select元素上使用onChange事件，如：

<select onChange="ship(this.selectedIndex, this.options[this.selectedIndex].value);

在这种情况下，ship函数获取所选选项的索引和值。因此，在您的情况下，将选项更改为

 <option value="<?php echo $pos; ?>">1</option>

可能也需要。

---

编辑：只有一半的问题。有关更好的解决方案，请参阅PSLs答案：

您已为select指定了ID，但在没有ID的选项上调用ship。但我想更改selectcolor@TomášAresakMalánek也添加了一个演示。我不知道为什么，但它不起作用。。是jQuery脚本吗？@TomášAresakMalánek我没有使用任何jQuery。。。从选择中删除onclick。你能提前知道我的身份证吗。。。？您的php代码现在是什么样子的。您需要用select元素的实际id替换selectId。@TomášAresakMalčnek我对php不太熟悉，但有一点是您应该删除onChange=ship；因为您正在使用window.onload中的代码对更改处理程序进行投标。您是否在控制台中看到任何错误，以及呈现的html是什么样子？@TomášAresakMalčnek您应该检查呈现的代码视图源代码，并查看控制台上是否有任何错误。

 <option value="<?php echo $pos; ?>">1</option>