答案 0 :(得分：1)
不需要编写那么多代码来通过innerHTML选项中的更改来更改元素的select。
您可以重构代码，使其非常简单，更具可读性，甚至可以在将来options上进行选择。
var htmlDesc = "I like coding";
var compDesc = "I like computers";
//keep more course descriptions here
function changeDescription(e) {
var desc = compDesc;
if(e.value === "IntroHTML")
desc = htmlDesc; //default HTML description
//keep more conditions to check for course selected
document.getElementById('Course_Description').innerHTML = desc; //changing innerHTML of description holder
};<label class="w3-label w3-text-black">Course Name</label>
<select id="Course_Name" name="Course_Name" onchange="changeDescription(this);" style="width:95%;" required>
<option value="IntroHTML" id="Course_HTML">Intro to HTML and CSS</option>
<option value="BuildComputers" id="Course_Comp">Build A Computer</option>
</select>
<label class="w3-label w3-text-black">Course Description</label>
<p id="Course_Description">I like coding</p>
答案 1 :(得分：0)
首先，删除＆＃34;;＆＃34;从功能。然后，你应该得到option的value属性而不是innerHTML。
答案 2 :(得分：0)
首先获取所选选项的值，然后更改说明
var e = document.getElementById(selectId);
var option = e.options[e.selectedIndex].value;
function myFunctionHTML() {
document.getElementById('Course_Description').innerHTML = "I like coding"
}
function myFunctionComp() {
document.getElementById('Course_Description').innerHTML = "I like computers"
}
var H = document.getElementById('Course_HTML').innerHTML;
var C = document.getElementById('Course_Comp').innerHTML;
var Course_Select = document.getElementById('Course_Name').innerHTML;
function myFunctionVar(selectId) {
var e = document.getElementById(selectId);
var option = e.options[e.selectedIndex].value;
if (option === "IntroHTML") {
myFunctionHTML();
}
if (option === "BuildComputers") {
myFunctionComp();
}
}<label class="w3-label w3-text-black">Course Name</label>
<select id="Course_Name" name="Course_Name" onchange="myFunctionVar('Course_Name')" style="width:95%;" required>
<option value="IntroHTML" id="Course_HTML">Intro to HTML and CSS</option>
<option value="BuildComputers" id="Course_Comp">Build A Computer</option>
</select>
<label class="w3-label w3-text-black">Course Description</label>
<p id="Course_Description">Hi there</p>
答案 3 :(得分：0)
这里是您的无错误代码尝试替换它，您的代码和测试是按预期工作的。
已从您的代码中删除;
修正了`if condition
function myFunctionHTML() {
document.getElementById('Course_Description').innerHTML = "I like coding";
}
function myFunctionComp() {
document.getElementById('Course_Description').innerHTML = "I like computers";
}
var H = document.getElementById('Course_HTML').innerHTML;
var C = document.getElementById('Course_Comp').innerHTML;
var Course_Select = document.getElementById('Course_Name').innerHTML;
function myFunctionVar() {
if (Course_Select == 'H') {
myFunctionHTML();
}
if (Course_Select == 'C') {
myFunctionComp();
}
}
答案 4 :(得分：0)
这是完整的代码
<label class="w3-label w3-text-black">Course Name</label>
<select id="Course_Name" name="Course_Name" onchange="myFunctionVar()" style="width:95%;" required>
<option value="IntroHTML" id="Course_HTML">Intro to HTML and CSS</option>
<option value="BuildComputers" id="Course_Comp">Build A Computer</option>
</select>
<label class="w3-label w3-text-black">Course Description</label>
<p id="Course_Description">Hi there</p>
<script>
function myFunctionHTML() {
document.getElementById('Course_Description').innerHTML = "I like coding"
}
function myFunctionComp() {
document.getElementById('Course_Description').innerHTML = "I like computers"
}
function myFunctionVar() {
var H = document.getElementById('Course_HTML').innerHTML
var C = document.getElementById('Course_Comp').innerHTML
var e = document.getElementById("Course_Name");
var Course_Select = e.options[e.selectedIndex].value;
if (Course_Select == 'IntroHTML')
{
myFunctionHTML()
}
else if (Course_Select == 'BuildComputers')
{
myFunctionComp()
}
}
</script>
这是小提琴
答案 5 :(得分：0)
我在你的代码中做了一些更正，请试试这个..
function myFunctionHTML() {
document.getElementById('Course_Description').innerHTML = "I like coding";
};
function myFunctionComp() {
document.getElementById('Course_Description').innerHTML = "I like computers";
};
var H = document.getElementById('Course_HTML').value;
var C = document.getElementById('Course_Comp').value;
function myFunctionVar() {
var Course_Select = document.getElementById('Course_Name').value;
if (Course_Select == H) {
myFunctionHTML();
}
if (Course_Select == C) {
myFunctionComp();
}
};<label class="w3-label w3-text-black">Course Name</label>
<select id="Course_Name" name="Course_Name" onchange="myFunctionVar()" style="width:95%;" required>
<option value="IntroHTML" id="Course_HTML">Intro to HTML and CSS</option>
<option value="BuildComputers" id="Course_Comp">Build A Computer</option>
</select>
<label class="w3-label w3-text-black">Course Description</label>
<p id="Course_Description">Hi there</p>