我在使if语句工作时遇到了一些问题。在html中,我有一个带有三个选项的下拉菜单,根据用户选择的选项,按下提交按钮后将生成一组不同的文本。
这就是我在脚本中的想法:
function hair() {
if (document.getElementById("hair").value == "2") {
document.getElementById("background").innerHTML = "Well done, it worked!";
}
}
这是在HTML中,我希望JavaScript对应于:
<div id ="hair">
What colour hair would you like your doll to have?
<select name = "hair" id ="hair">
<option id="brown" value="0">Brown</option>
<option id="blonde" value="1">Blonde</option>
<option id="red" value="2">Red</option>
</select>
</div>
当用户选择"红色"并按下按钮时,我本质上是想让页面说"干得好,成功了!"。有人能告诉我我可能做错了什么吗?我基本上是个初学者,所以简单的解释将不胜感激!谢谢
您的代码内部有一些问题:
- 更改选择时不调用函数
- 您有重复的div头发,id必须是唯一的
试试这个:
function hair() {
if (document.getElementById("select-hair").value == "2") {
document.getElementById("background").innerHTML = "Well done, it worked!";
}
}
使用以下HTML:
<div id ="hair">
What colour hair would you like your doll to have?
<select name = "hair" id ="select-hair" onchange="hair()">
<option id="brown" value="0">Brown</option>
<option id="blonde" value="1">Blonde</option>
<option id="red" value="2">Red</option>
</select>
</div>