我正在尝试创建具有名称和时间的新元素。我想让用户自定义它们(例如,可以改变颜色)。
下拉选项只对第一个类有效,它改变了颜色,但其余的都不起作用。我怎么才能修复它?
function f_color() {
var x = document.getElementById('Tcolor1').value;
window.alert(x);
if (x == 0) {
document.getElementById('input1').style.color = "black";
document.getElementById('input2').style.color = "black";
document.getElementById('input3').style.color = "black";
}
if (document.getElementById('Tcolor').value == 1) {
document.getElementById('input1').style.color = "red";
document.getElementById('input2').style.color = "red";
document.getElementById('input3').style.color = "red";
}
if (document.getElementById('Tcolor').value == 2) {
document.getElementById('input1').style.color = "blue";
document.getElementById('input2').style.color = "blue";
document.getElementById('input3').style.color = "blue";
}
}
<button id="btn2">Add Another Class</button>
<form>
<select class="form-control" id="Tcolor" name="Tcolor" style="color:black;
font-size: 20px; " onchange="f_color()">
<option value=0>black </option>
<option value=1>red</option>
<option value=2>blue </option>
</select>
</form>
<form>
<input id="input1" name="className"><br>
<input id="input2" name="classTime"><br>
<input id="input3" name="classNote"><br>
</form>
https://stackoverflow.com/questions/56031967
复制相似问题