我发布了一个类似的问题,但它被取下,把我仍然很好奇为什么这么微不足道的东西不工作.这是我所有的html/JavaScript.
<!doctype html>
<html lang="eng">
<head>
<meta charset="utf-8">
<title>FoxBooks</title>
<link rel="stylesheet" type="text/css" href="Foxbooks.css" />
</head>
<body>
<h1>FoxBooks</h1>
<div id="course_selection">
<h2>Find Your Textbooks:</h2>
<p>Enter the CRN:</p>
<select name="" id="CRN">
<optgroup>
<option value=""></option>
</optgroup>
</select>
<input type="submit" value="Submit" id="btn" />
</div>
<h1 id="Course_Info"></h1>
<script>
字符串
我的JavaScript从这里开始
selectCRN = document.getElementById("CRN").value;
courseInfo = document.getElementById("Course_Info");
button = document.getElementById("btn");
async function getData(){
//try this code, if it doesn't work...
try{
let response = await fetch('https://davise7823.github.io/SD330/foxbooks.json'); // make a request to a JSON endpoint
let data = await response.json(); // parse the response as JSON
//populates the "CRN" selection list
for (let i = 0; i < data.courses.length; i++){
var x = document.getElementById("CRN");
var option = document.createElement("option");
option.text = data.courses[i].CRN;
x.add(option);
}
//If one is selected display it in the course info element
型
这就是if else语句失败的地方
button.addEventListener("click", () => {
if(selectCRN == 12054){
courseInfo.innerHTML = data.courses[0].Name;
}else if (selectCRN == 10016) {
courseInfo.innerHTML = data.courses[1].Name;
}else if(selectCRN == 11011){
courseInfo.innerHTML = data.courses[2].Name;
}else if(selectCRN == 11338){
courseInfo.innerHTML = data.courses[3].Name;
}else if(selectCRN == 12005){
courseInfo.innerHTML = data.courses[4].Name;
}else if(selectCRN == 12017){
courseInfo.innerHTML = data.courses[5].Name;
}else if(selectCRN == 11452){
courseInfo.innerHTML = data.courses[6].Name;
}else if(selectCRN == 12904){
courseInfo.innerHTML = data.courses[7].Name;
型
除了if else语句之外,如果在这里放入其他任何东西,它都可以工作。
}
});
}
//run this code to show any errors
catch (error) {
console.error(error); // handle any errors
}
}
getData();
型
我的js到此为止
</script>
<footer>
<hr />
<small>© Elijah D - 09/25/23</small>
</footer>
</body>
</html>
型
1条答案
按热度按时间41zrol4v1#
就像@jaromanda-x在他们的评论中指出的那样,
element.value
需要在事件侦听器内部进行评估,而不是在它之前。个字符