我正在和我儿子做一个测验来教他 HTML。但我在使用一些 JavaScript 时遇到了问题(没有 jquery 或任何其他库)。一切都正常,直到最后。它应该告诉我们有多少是对的,有多少是错的,但我们却得到了未定义的结果。
错误读取:未捕获类型错误:无法分配给第 17 题(共 16 题)的只读属性“innerHTML”
HTML
<body id="body">
<div id="pokeBallL"> </div>
<div id="pokeBallR"> </div>
<div id="spacer"> </div>
<h2 id="tstat"></h2>
<div id="test"> </div>
</body>
JavaScript
(function () {
"use strict";
/*global window,alert*/
var UIlogic = {
myStuff: function () {
var pos = 0, question, test, tstat, Myquestions, btnCheck, choice, choices, chA, chB, chC, chD, correct;
Myquestions = [
["What decade wear you born?","1980's","1990's","2000's","2010's","A"],
["What activity do you like more","Gaming","Camping","Travelling","Sleeping","A"],
["Pick a color","Black","Pink","Red","Blue","A"],
["Pick a number","22","42","4","7","A"],
["Choose a weapon","Battleaxe","Sword","Daggers","pen","A"],
["Pick an animal","Tiger","Monkey","Elephant","Human","A"],
["Pick a music genre","Rock","Hip-hop","Country","Folk","A"],
["How many legs do Butterflies have?","4 legs","6 legs","2 legs","3 legs","A"],
["How many stripes are on the American flag?","13","15","7","19","A"],
["Which is the nearest star?","Centauri A","Sol","Sirius","Proxima Centauri","A"],
["Longest river in the world is...?","Mississippi","Nile","Amazon","Ohio","A"],
["Pick one...","PS4","PC Master Race","XB One","Puny Apple","A"],
["Pop or Soda?","Pop","Both","Soda","Soft Drink","A"],
["What is your favorite creature","Amphibian","Mammal","Reptile","Avian","A"],
["Pick a squad position","Squad Leader","FTL","","Grenadier","A"],
["The Zombie apocalypse has begun! CHoose your path...","Get to lifeboat","Live inside mountains","Hold-up above gas station","Become Zombie","A"]
];
function _(x) {
return document.getElementById(x);
}
function renderQuestion() {
test = _("test");
tstat = _("tstat").innerHTML = "Question " +(pos + 1)+ " of " +Myquestions.length;//seems to have an issue here
if(pos >= Myquestions.length) {
test.innerHTML = "<h2>You got " +correct+ " out of " +Myquestions.length+ " questions correct!</h2>";
tstat.innerHTML = "<h2>Test completed</h2>";
pos = 0;
correct = 0;
return false;
}
question = Myquestions[pos][0];
chA = Myquestions[pos][1];
chB = Myquestions[pos][2];
chC = Myquestions[pos][3];
chD = Myquestions[pos][4];
test.innerHTML = "<h3>"+question+"</h3><hr />";
test.innerHTML += "<h4><input type='radio' name='choices' value='A'>"+chA+"</h4><br />";
test.innerHTML += "<h4><input type='radio' name='choices' value='B'>"+chB+"</h4><br />";
test.innerHTML += "<h4><input type='radio' name='choices' value='C'>"+chC+"</h4><br />";
test.innerHTML += "<h4><input type='radio' name='choices' value='D'>"+chD+"</h4><br />";
test.innerHTML += "<button id='btnCheck' class='btnClass'>Submit</button>";
btnCheck = document.getElementById("btnCheck");
btnCheck.addEventListener('click', checkAnswer, false);
}
renderQuestion();
function checkAnswer() {
choices = document.getElementsByName("choices");
for(var i = 0; i<choices.length; i++) {
if(choices[i].checked){
choice = choices[i].value;
}
}
if(choice == Myquestions[pos][5]) {//somewhere here doesn't seem right either.
correct++;
}
pos++;
renderQuestion();
}
}
};
window.onload = function () {
UIlogic.myStuff();
};
}());
最佳答案
分隔此行
tstat = _("tstat").innerHTML = "Question " +(pos + 1)+ " of " +Myquestions.length;//seems to have an issue here
进入此:
tstat = _("tstat");
tstat.innerHTML = "Question " +(pos + 1)+ " of " + (Myquestions.length + 1);
关于javascript - JS 测验 - Uncaught Error -,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30495383/