如何使HTML命令框与JavaScript一起工作？

我有一个HTML命令框，用来执行命令，比如更改样式表之类的东西。我以为我施了魔法，但根本没用。下面是包含JS和CSS的HTML。如果你认为自己有想法，请随时提出建议

函数检查命令（）{
var tempStyle=document.getElementById（'temp-style'）
var commandInput=document.getElementById（'文本框'）
if（commandInput.value==黑色）{
tempStyle.setAttribute（“href”，“black.css”）
}
if（commandInput.value==橙色）{
tempStyle.setAttribute（“href”，“orange.css”）
}
if（commandInput.value==白色）{
tempStyle.setAttribute（“href”，“white.css”）
}
如果（commandInput.value==windows）{
tempStyle.setAttribute（“href”，“windows.css”）
}
}

#文本框{
字号：18px；
宽度：500px；
高度：20px；
}
#提交表格{
显示：无；
}

黑色：背景颜色更改为黑色，文本颜色更改为白色

橙色：背景颜色更改为橙色，文本颜色更改为蓝色

白色（默认）：背景色更改为白色，文本颜色更改为黑色



Windows：背景图像更改为Windows XP Bliss，文本颜色更改为黑色

我需要在每个if条件中添加一个额外的“=”符号，因为我引用的是一个字符串，我需要将该字符串放在引号中。在我提交表单后，它刷新了页面，因此没有保存任何内容。解决方法是在checkCommand（）的末尾添加“event.preventDefault（）；”；功能。这是最终的JavaScript产品。其他一切都很好

JavaScript

函数检查命令（）{
var tempStyle=document.getElementById（'temp-style'）
var commandInput=document.getElementById（'文本框'）
如果（commandInput.value==“黑色”）{
tempStyle.setAttribute（“href”，“black.css”）
}
如果（commandInput.value==“橙色”）{
tempStyle.setAttribute（“href”，“orange.css”）
}
如果（commandInput.value==“白色”）{
tempStyle.setAttribute（“href”，“white.css”）
}
如果（commandInput.value==“windows”）{
tempStyle.setAttribute（“href”，“windows.css”）
}
form.reset（）；
event.preventDefault（）；
}

编辑

---

我还添加了“event.preventDefault（）；”之前的“form.reset（）；”，以便在按enter键时清除表单。

我可以看到两个问题：首先，您的条件应该是检查字符串

commandInput.value==“black”

等等。其次，您没有取消表单的提交事件，因此页面（看起来）只是立即重新加载。您应该将事件传递给函数并调用

event.preventDefault（）@NiettheDarkAbsol如何防止重新加载？是否将“onclick='event.preventDefault（）；'”添加到表单标记中？请记住，这可能无关紧要，但我使用的是enter键，因此我不知道onclick是否适用于它。在checkCommand函数中，执行event.preventDefault（）（但确保传入事件参数）。@Kurt它有效！我很高兴，因为这是我一整天唯一的问题，现在已经解决了。非常感谢！