Reputation: 109
I am having an issue with an Alert Box not appearing on the screen after I click a submit button. I have searched this forum and online for answers and I don't see what is wrong with my code. As with most of my issues, the solution is probably a simple fix but I can't seem to find the issue after going through my code. Any help is appreciated.
javascript code
<script type="text/javascript">
function stopClock() {
clearInterval (clockId);
correctAns = gradeQuiz();
alert('You have' + correctAns + 'correct of 5 in' + timer + 'seconds');
}
</script>
<script type="text/javascript">
function runClock() {
seconds++;
document.getElementById('quizclock').value=seconds;
}
</script>
<script type="text/javascript">
function startClock() {
showQuiz();
clockId=setInterval ("runClock()", 1000);
}
</script>
function resetQuiz() {
document.quiz.quizclock.value = 0;
for (i=0; i<document.quiz.elements.length; i++)document.quiz.elements[i].disabled=false;
document.quiz.stop.disabled = true;
}
function showQuiz() {
document.getElementById("quiztable").style.visibility="visible";
document.quiz.start.disabled = true;
document.quiz.stop.disabled = false;
}
function hideQuiz() {
document.getElementById("quiztable").style.visibility="hidden";
}
function gradeQuiz() {
correct=0;
if (document.quiz.q1[1].checked) correct++;
if (document.quiz.q2[3].checked) correct++;
if (document.quiz.q3[0].checked) correct++;
if (document.quiz.q4[3].checked) correct++;
if (document.quiz.q5[2].checked) correct++;
document.getElementById("cor1").style.backgroundColor="yellow";
document.getElementById("cor2").style.backgroundColor="yellow";
document.getElementById("cor3").style.backgroundColor="yellow";
document.getElementById("cor4").style.backgroundColor="yellow";
document.getElementById("cor5").style.backgroundColor="yellow";
for (i=0; i<document.quiz.elements.length; i++)document.quiz.elements[i].disabled=true;
return correct;
}
html for button that pops up the alert
<input id="stop" type="button" value="Submit Answers" onclick="stopClock()"/>
Upvotes: 0
Views: 405
Reputation: 15893
You need to define your variables and use seconds
in alert
.
Change your functions to:
var clockId;
var seconds = 0;
function stopClock() {
clearInterval (clockId);
correctAns = gradeQuiz();
alert('You have' + correctAns + 'correct of 5 in' + seconds + 'seconds');
}
function startClock() {
showQuiz();
seconds = 0;
clockId=setInterval (runClock, 1000);
}
Upvotes: 0
Reputation:
Probably you have a variable undefined, check this working demo
function gradeQuiz() {
return 'something';
}
var clockId, i = timer = 0;
clockId = setInterval(function() {
i++;
$('h2').text(i);
}, 200);
function stopClock() {
clearInterval (clockId);
correctAns = gradeQuiz();
alert('You have ' + correctAns + ' correct of 5 in ' + timer + ' seconds');
}
$('button').on('click', stopClock);
http://jsbin.com/toyibekivu/edit?html,js,output
Upvotes: 2
Reputation: 10746
If you remove
alert('You have' + correctAns + 'correct of 5 in' + timer + 'seconds');
from your stopClock()
function no alert will appear on the screen.
Upvotes: 0