Question

我有一个非常简单的代码，我刚刚编写了一个从select元素中获取颜色值并使用它来设置特定类中元素的边框颜色，但它似乎并不起作用。这是代码：

HTML：

<select id="colorSelect" onChange="changeColor()">
    <option value="#000000" selected="selected">Black</option>
    <option value="#0000FF">Blue</option>
    <option value="#FF0000">Red</option>
</select>

有更多选项采用与红色和蓝色相同的格式，但我将它们留出来以节省空间。

这是JavaScript：

function changeColor
{
    var picker    = document.getElementById("colorSelect");
    var colorName = picker.options[picker.selectedIndex].value;

    document.getElementByClassName("bordered").style.backGroundColor=colorName;
}

Answer 1

夫妻问题，

首先，您是否错过了函数声明中的()，它应该是：

function changeColor() { 

}

第二件事是getElementByClassName是getElementsByClassName（请注意＆＃34; s＆＃34;在元素的末尾） - 这将返回一个集合，因此您必须指定索引：

document.getElementsByClassName("bordered")[0].style.backGroundColor=colorName;

另外，（感谢@AmmarCSE看到这个） - 您之后的style属性是backgroundColor - 而不是backGroundColor（JS非常区分大小写）

另一个重要的注意事项是在开发时始终打开控制台，您将能够看到正在发生的错误以及在哪里发生错误。（通常F12在大多数浏览器上打开控制台）

选择元素不起作用

1 个答案: