...

View Full Version : Simple Quiz Problem



Alann
10-23-2003, 10:03 PM
I am just starting to learn javascript and have written the code for a simple quiz. The quiz asks a question and prompts for an answer. If the answer is wrong you can either click on a button to try again or place the mouse over a link to get a clue. However, when the answer is correct the try again button and the clue still appear. How do I correct the code so that the button and the mouseover do not show when the answer is correct?

Here is the link to the quiz:
http://users3.ev1.net/~anortham/quiz/quiz.htm

Thanks for your help in advance!

Alann

COBOLdinosaur
10-23-2003, 10:34 PM
Change the layer to keep it hidden:

<div id=thediv" style="display:none">
<DIV align=center>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P></P>
<P align=center>
<FORM><INPUT name=button onclick="window.location='quiz.htm'" type=button value="Try Again"></FORM></P></DIV>
<P>&nbsp;</P>
<P align=center><A href="" onmouseover="alert('They are not Red')">Clue</A></P></div>

Then change the script to:

else
{
document.write("<CENTER><H1>'Your answer is incorrect!'<\/H1><\/CENTER>");
document.write("<CENTER><FONT size=4>'The correct answer will be given on Monday'<\/FONT>
document.getElementByid('thediv').display='block';
<\/CENTER>");

}

Alann
10-24-2003, 07:57 AM
Thanks "COBOLdinosaur" for the code!

I have made the changes but looks like I either made a mistake in implementing the code or it still needs a few more tweeks.

The link to the modified code is: http://users3.ev1.net/~anortham/quiz/quiz_modified.htm

The link to the original code is still at: http://users3.ev1.net/~anortham/quiz/quiz.htm

I appreciate your help!
Alann,

Kor
10-24-2003, 01:27 PM
there is an unterminated strings literal. add the bolded below:

document.write("<CENTER><FONT size=4>'The correct answer will be given on Monday'<\/FONT>");

Alann
10-24-2003, 02:38 PM
Thanks Kor for pointing out the error! Corrections to code per Kor's recommendations have been made. Problem still exists!

Alann,

(See links in my last response...)

Kor
10-24-2003, 05:24 PM
I see now that there might be another syntax problem

if you use document.write("whichever")

you don'y need to use

document.write("whic 'e'ver")

so remove all the ' inside the string

document.write("bla") writes exactly (except some reserved as " or ' inside - which must be specified as string element with backslash - \" or \') what there must be as HTML line codes.

So:



document.write("<CENTER><H1>Your answer is incorrect!</H1></CENTER>");
document.write("<CENTER><FONT size=4>The correct answer will be given on Monday</FONT>


try this above

Kor
10-24-2003, 05:27 PM
I see you have not made the previous changes, so try this again:



document.write("<CENTER><H1>Your answer is incorrect!</H1></CENTER>");
document.write("<CENTER><FONT size=4>The correct answer will be given on Monday</FONT>");

Alann
10-24-2003, 08:43 PM
Corrections made per "Kor's" recommendations. Problem still exists.

I moved the <\/CENTER>"); code and now the quiz partially works. However the TRY AGAIN button and the TIP link are still being hid all the time.

The link to the modified code is: http://users3.ev1.net/~anortham/quiz/quiz_modified.htm

The link to the original code is still at: http://users3.ev1.net/~anortham/quiz/quiz.htm

COBOLdinosaur
10-25-2003, 05:58 PM
Sorry there is an error in the code I posted:

This:

document.getElementByid('thediv').display='block';

Should be:

document.getElementById('thediv').style.display='block';

Sometimes I try to type faster than it is possible for a dinosaur to move. :o

Alann
10-27-2003, 08:52 PM
Made correction to code per "COBOLdinosaur" recommendation. Problem still exists!

Vladdy
10-27-2003, 09:35 PM
Just out of curiosity: there are so many javascript quizes, why trying to reinvent the wheel?

Alann
10-27-2003, 09:48 PM
I am just learning javascript, and I am developing the quiz as an exercise in programming. I got the quiz to work OK but then wanted to hide the button when the quiz answer is wrong and didn't know how to do it so I am seeking help. The end result is not as important as the learning and understanding of javascript that I am getting. :)

COBOLdinosaur
10-27-2003, 10:07 PM
you missed part of the code fix. you inseted style okay, but you missed the spelling mistake in teh method:

I originally spelled it:
document.getElementByid

In the corrected version it is: document.getElementById

Both JavaScript and the DOM are case sensitive. You were getting a scripting error on the page. If you do not have messaging on, then go to the advanced setting on your IE browser and set it to display every error message, it will save you a lot of time.

Alann
10-27-2003, 10:38 PM
Opps!!! Sorry about that. I need to learn to look at the case more closely.

I made the correction to "document.getElementById" but the button is still not showing when the answer is incorrect.

I wanted to let you know that I do appreciate all your help :)

COBOLdinosaur
10-28-2003, 11:07 PM
Okay I see what is happening. The page structure is wrong. You have an HTML problem. You cannot reference the div before it is created. That is why you get a scripting error. The script need to be in a function.

It will work fine this way

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD>
<META content="text/html; charset=windows-1252" http-equiv=Content-Type>
<SCRIPT language=JavaScript>
<!--hide
var correct=false;
var yourname= prompt('Please enter your answer!', ' ');
var viewanswer=""
function setbutton()
{
if (!correct) document.getElementById('thediv').style.display='block';
}
//-->
</SCRIPT>

<META content="MSHTML 5.00.2920.0" name=GENERATOR></HEAD>
<BODY onLoad="setbutton()" background="" bgColor=#e6e6fa>
<P align=center>
<SCRIPT language=JavaScript>
<!--hide

if ((yourname=='Blue') || (yourname=='blue') || (yourname=='BLUE'))
{
document.write("<CENTER><H1>Your answer is correct!<\/H1><\/CENTER>");
correct=true;
}
else
{
document.write("<CENTER><H1>Your answer is incorrect!<\/H1><\/CENTER>");
document.write("<CENTER><FONT size=4>The correct answer will be given on Monday<\/FONT>)<\/CENTER>");

}


//-->
</SCRIPT>
</P>
<div id="thediv" style="display:none">
<DIV align=center>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P>&nbsp;</P>
<P></P>
<P align=center>
<FORM><INPUT name=button onclick="window.location='quiz.htm'" type=button value="Try Again"></FORM></P></DIV>
<P>&nbsp;</P>
<P align=center><A href="" onmouseover="alert('They are not Red')">Clue</A></P></div>
</BODY></HTML>

Alann
10-29-2003, 03:04 PM
Thanks "COBOLdinosaur" for the corrected code. I have incorporated the code and everything is now working as I had hoped. :thumbsup: I want to thank you alot for all the help, all the time invested, and in being so patient with me as I am just starting to learn javascript. Now all I have to do is to study the code in detail for understanding of exactly how it works.

The following are the links for the original code and the corrected code that makes the simple quiz work correctly.

The link to the modified code is: http://users3.ev1.net/~anortham/quiz/quiz_modified.htm

The link to the original code is still at: http://users3.ev1.net/~anortham/quiz/quiz.htm

Thanks again,
Alann,



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum