Help With my HTML Project ;)

DarkDavil · 18 Oct 2009

Im just learning basic HTML, and this is my first year - and i need some help with my project!! Here is my code so-far: But I left space in between the <script language=JavaScript> and the </script> tags for my variables. Thats really all i dont kno how to do :P

<html>
<head>



<title>Biology Quiz!</title>
<script language=JavaScript>

</script>
</head>

<body onLoad="alert('Instructions: You Pick a Choice for Your Answer. After You Are Done, Hit the Grade Now! Button, To Restart Simply Hit The Reset Button, There are also Instructions On The Webpage, To View Those, Simply Hit The Button Labled Instructions. Scroll Down Beneath the Picture to View the Quiz Questions And Also Buttons To Help You On Your Way! Good Luck!')">

<center>
<h1> The Bio Quiz Page</h1></center>
<hr width=175>
<center>
<input type="button" value=Instructions onClick="alert('Instructions: You Pick a Choice for Your Answer. After You Are Done, Hit the Grade Now! Button, To Restart Simply Hit The Reset Button, There are also Instructions On The Webpage, To View Those, Simply Hit The Button Labled Instructions. Scroll Down Beneath the Picture to View the Quiz Questions And Also Buttons To Help You On Your Way! Good Luck!')">

<input type="button" onClick="parent.location='#Start'" value="Go to Survey Start"></center>

<center><table border=7 bordercolor=black><td><img src="quiz.jpg"></td></center><tr><td>

<a name="Start"><center><h1> Are you Ready?</h1></center>
</tr></td>
</table>

<td><h1> 1. What are Proteins made up of?</h1></td><tr>
<input type=radio name=one value="A"> A. Hydrogen and Oxygen<br>
<input type=radio name=one value="B"> B. Hydrogen and Nitrogen<br>
<input type=radio name=one value="C"> C. Hydrogen, Oxygen, and Carbon<br>
<input type=radio name=one value="D"> D. Hydrogen, Oxygen, Nitrogen, and Carbon<br>
<input type=textarea name=Q1 size=70>
</tr>

<td><h1> 2. What are Fats/Lipids made up of?</h1></td><tr>
<input type=radio name=two value="A"> A. Carbon<br>
<input type=radio name=two value="B"> B. Hydrogen<br>
<input type=radio name=two value="C"> C. Oxygen<br>
<input type=radio name=two value="D"> D. All of the Above!<br>
<input type=textarea name=Q2 size=70>
</tr>

<td><h1> 3. What are Carbohydrates made up of?</h1></td><tr>
<input type=radio name=three value="A"> A. Carbon<br>
<input type=radio name=three value="B"> B. Oxygen<br>
<input type=radio name=three value="C"> C. Carbon and Oxygen<br>
<input type=radio name=three value="D"> D. Carbon and Nitrogen <br>
<input type=textarea name=Q3 size=70>
</tr>

<td><h1> 4. What are the Four Basic Elements of Life?</h1></td><tr>
<input type=radio name=four value="A"> A. Carbon, Nitrogen, and Hydrogen<br>
<input type=radio name=four value="B"> B. Nitrogen and Carbon<br>
<input type=radio name=four value="C"> C. Oxygen and Hydrogen<br>
<input type=radio name=four value="D"> D. Carbon, Hydrogen, Oxygen, Nitrogen<br>
<input type=textarea name=Q4 size=70>
</tr>

<td><h1> 5. What is the Chemical Formula for the Carboxyl Group?</h1></td><tr>
<input type=radio name=five value="A"> A. NH2<br>
<input type=radio name=five value="B"> B. COOH<br>
<input type=radio name=five value="C"> C. H2O<br>
<input type=radio name=five value="D"> D. CHON<br>
<input type=textarea name=Q5 size=70>
</tr>

<td><h1> 6. What is the type of Bond Water forms with other Water Molecules?</h1><td><tr>
<input type=radio name=six value="A"> A. Ionic Bond<br>
<input type=radio name=six value="B"> B. Hydrogen Bond<br>
<input type=radio name=six value="C"> C. Metallic Bond<br>
<input type=radio name=six value="D"> D. H2O Bond<br>
<input type=textarea name=Q6 size=70>
</tr>

<td><h1> 7. What are Proteins used for in the Human Body?</h1></td><tr>
<input type=radio name=seven value="A"> A. Store Energy<br>
<input type=radio name=seven value="B"> B. No Use<br>
<input type=radio name=seven value="C"> C. Make us Smarter<br>
<input type=radio name=seven value="D"> D.Help us Digest<br>
<input type=textarea name=Q7 size=70>
</tr>
<br>
<center><td><h1> Total Score:</h1>
<input type=textarea name=Ans rows=6>
</center>
</td>

But what i need help with is the variable part... I kno that they go withen the <script language=JavaScript> and </script> tags, but how do i make the variables store all of that info. and make it do those certain things..

Note:
The textboxes underneath each question are to display either - Yes, this is correct, or No, this is not correct. The Text box at the bottom of the page, underneath Total Score, will show the score out of X number of points, and etc. etc. And also, the "test" will only be graded once a "Grade Now" button has been clicked, which i will make once i figure out the variables. So, any help with the variables?

Notex2: This was programmed to work in IE8, which is what my school uses, so, when i opened it in my own laptop at home(im on it now) it's format was different as viewed in my Google Chrome Browser.

Thanks ^^

ultimatebuster · 18 Oct 2009

first of all, this has to be changed:

Code:

<center><td><h1> Total Score:</h1>
<input type=textarea name=Ans rows=6>
</center>

the <center> tag is deprecated. I strongly recommend you to use the CSS styling method to avoid compatibility issue later on. It is also a good practise to do so.

Change it to this:

Code:

<td width="100%"><h1 style="text-align:center;"> Total Score:</h1>
<input type=textarea name=Ans rows=6>

There is a lot of issues with the tag placements and stuff, I won't go into it too much. You shouldn't use too much tables as your outline. Maybe later I can help you re-organize the code.

As to your question

I need to know what you need to do. Because "do certain things" is not really descriptive enough.
In order to store variables you can declare the variable using the term var

Example:

Code:

var numbers = 1;

that basically tells the browser that the variable "numbers" is 1

you can also do this:

Code:

var string = "Hello World"

That will store "Hello world" in the variable "string", so you can use them later on.

Disclaimer: I'm also a javascript n00b

=====================================

After furthur examining your code, I found a lot of errors. Little things like <br> and <br />, not having "" while declaring names etc.

I strongly recommend you to finish the HTML Tutorial at w3schools before attempting to code this page. You may need a complete re-write of the code.

Futhur more, I strongly recommend you to finish the CSS Tutorial at w3schools so you can make your page look prettier.

This is an example project made by me, modify as you wish

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>
<style type="text/css">
<!--
h1 {
	text-align: center;
}
-->
</style>
<script type="text/javascript">
//Written as a test project by ultimatebuster
//KKSNetwork - http://thekks.net
function checkAns(){
	var rightAnswer = document.getElementById("right"); //Get the element with the id of "right"
	var wrongAnswer = document.getElementById("wrong"); //Get the element with the id of "wrong"
	if (rightAnswer.checked==false && wrongAnswer.checked==false) { // check if nothing is selected
		alert ("You haven't selected anything yet!");
	} else {
	if (rightAnswer.checked==true) { // Basically saying if the Right Answer radio box is check, then
	alert ("You win!"); //calls msgbox
	} else { // or else
	alert ("You lose!"); //calls msgbox
	}
	}

}
</script>

</head>

<body>
<h1>Test
</h1>
<h2>Choose one:</h2>
<p>
<form name="form1">
  <label>
    <input type="radio" name="radio" id="right" value="right" />Right Answer
    <br />
    <input type="radio" name="radio" id="wrong" value="wrong" />Wrong Answer
  </label></form>
</p>
<p>
  <label>
    <input type="submit" name="button" id="button" value="Submit" onclick="checkAns()" />
  </label>
</p>
</body>
</html>

you can find the same thing at http://delta.thekks.net/radio.html

DarkDavil · 19 Oct 2009

Mmmm... valid points. But i mean- you can take it up with my teacher

We were told that a <br> tag, the line break tags didn't even need quotes and as well as they didn't even need a </br> tag

But thanks for the tips - as for using CSS style sheet, i decided not to due to the small space of time i was given for my project

ultimatebuster · 19 Oct 2009

What? Your teacher told you to use <br>????? No offense, but that's really kinda n00b-ish.

In HTML, especially the future version, it's best (will become required) for you to close every single HTML tags you open.

So you would open an html tag like <p> and close it with </p>

In the case of <br>, or line break, there won't be any information stored within the tag <br>. You can technically close the <br> tag by typing </br> afterwards, but that's just wasting space, therefore, we use something like this <br />
That slash at the end will basically close the tag.

You can also apply that to images
<img src="file.png" alt="My Picture" />

I have a general purpose style sheet somewhere on my HDD, but I can't find it right now. This general purpose style sheet (badly made, sorry. It took me 30 minutes) can be found modified at My IP Maybe you can snatch it off there?