Question

我正在搜索一个Javascript函数，如果选择了一个选项，它会改变我的选择字段的背景颜色。

HTML：

<select name="classNumber" id="classNumber">
 <option selected disabled value="0">Bitte Klasse auswählen</option>
 <option value="5">5</option>
 <option value="6">6</option>
 <option value="7">7</option>
 <option value="8">8</option>
 <option value="9">9</option>
 <option value="10">10</option>
 <option value="11">11</option>
 <option value="12">12</option>
 <option value="13">13</option>
</select>
<select name="classSpecify" id="classSpecify">
 <option selected disabled value="0">Bitte Klasse spezifizieren</option>
 <option value="A">A</option>
 <option value="B">B</option>
 <option value="D">C</option>
 <option value="D">D</option>
 <option value="N">N (Naturwissenschaftliches Profil)</option>
 <option value="S">S (Sprachliches Profil)</option>
 <option value="G">G (Gesellschaftliches Profil)</option>
</select>

Javascript无效，此时仅用于测试我只设置了一个选择：

var classNumber = document.getElementById('classNumber');
var first = classNumber.options[classNumber.selectedIndex].value;
if (first != 0) {
    alert('Test');
    document.getElementById('classNumber').style.background="$green";
};

Answer 1

我假设你想远离jQuery。

你遗漏了一些东西。首先，当用户更改时，没有任何内容可以调用您的if语句。将事件.onchange添加到classNumber以及backgroundcolor的背景。

喜欢这样。

var classNumber = document.getElementById('classNumber');
classNumber.onchange = runBackgroundChange;

function runBackgroundChange(first){
    var value = first.srcElement.options[first.srcElement.selectedIndex].value;
    if (value != 0) {
        alert('Test');
        document.getElementById('classNumber').style.backgroundColor="green";
    } else {
        document.getElementById('classNumber').style.backgroundColor="initial";
    };
}

Answer 2

改变这个：

if (first != 0) {

为：

if (first !== 0) {

和此：

"$green"

为：

"green"

你想要comparison(==）运算符。

Javascript：如果选择了选项，请更改选择背景颜色

2 个答案: