•

Check out our Community Blogs

Register and join over 40,000 other developers!

### Recent Status Updates

• surajkumardotin

Student college project

• TopHatProductions115

The TXP-Network is coming back this July...

• moonvik

Java...

• phi

I love this community !

• JackJames

hi i am jack i am seo expert jack james would love you to read new post

# JavaScript:Tutorial, Your First Game!

35 replies to this topic

### #1 TcM

TcM

CC Mentor

• VIP Member
• 7563 posts

Posted 05 December 2006 - 01:05 PM

Introduction:-
Here I will show you how to make a simple 'Guess The Number' game. It will do fine as your first game!

Solution:-
This goes in the <head>:-
```<SCRIPT LANGUAGE="JavaScript">
var num = Math.floor(Math.random() * 101);
function guessnum(){
var guess = document.forms['form1'].num.value;
if (guess == num)
{
alert("Great you Guessed! How did you know that?");
}
if (guess < num)
{
alert("No your number is too low!");
}
if (guess > num)
{
alert("No your number is too  high");
}
}
</SCRIPT>
```

And this in the <body>
```<form name="form1">
Enter a number <input type="text" size=5 maxlength=3
name="num"> <input type="button" onClick="guessnum();"
value="Enter">
</form>
```

Explanation:-
```var num = Math.floor(Math.random() * 101);
```
This is a Mathematical Function Math.Random() is to choose a random number *101 means up to 100 so the numbers will be from 0 to 100 and Math.floor is so to eliminate any decimal points

A Preview:-

Conclusion:-
As Always Feedback is welcome and the full source is attached!!

• 0

### #2 ahmed_14_1

ahmed_14_1

CC Lurker

• Just Joined
• 1 posts

Posted 17 November 2007 - 04:27 AM

thanks man for this code
• 0

### #3 \$RaMRoM\$

\$RaMRoM\$

CC Lurker

• Just Joined
• 5 posts

Posted 18 January 2008 - 04:42 AM

wow! javaScript is amazing! thanks a lot!
• 0

### #4 chili5

chili5

CC Mentor

• Expert Member
• 3038 posts
• Programming Language:Java, C#, PHP, JavaScript, Ruby, Transact-SQL
• Learning:C, Java, C++, C#, PHP, JavaScript, Ruby, Transact-SQL, Assembly, Scheme, Haskell, Others

Posted 12 March 2008 - 10:45 AM

I don't see anything in the code section.

I've seen this before its really cool though and very easy to change the range for the random number.

----------------
Now playing: Disturbed - I'm Alive
via FoxyTunes
• 0

### #5 TcM

TcM

CC Mentor

• VIP Member
• 7563 posts

Posted 22 March 2008 - 07:37 AM

What code section? You mean the code tags are empty??

Well they are not empty for me :S
• 0

### #6 chili5

chili5

CC Mentor

• Expert Member
• 3038 posts
• Programming Language:Java, C#, PHP, JavaScript, Ruby, Transact-SQL
• Learning:C, Java, C++, C#, PHP, JavaScript, Ruby, Transact-SQL, Assembly, Scheme, Haskell, Others

Posted 22 March 2008 - 09:05 AM

Last time I was here, the code tags were empty.
• 0

### #7 TcM

TcM

CC Mentor

• VIP Member
• 7563 posts

Posted 22 March 2008 - 02:03 PM

Maybe because you did not have enough posts to view the code in the threads?
• 0

### #8 chili5

chili5

CC Mentor

• Expert Member
• 3038 posts
• Programming Language:Java, C#, PHP, JavaScript, Ruby, Transact-SQL
• Learning:C, Java, C++, C#, PHP, JavaScript, Ruby, Transact-SQL, Assembly, Scheme, Haskell, Others

Posted 22 March 2008 - 02:22 PM

Wait you have to have a certain number of posts to see code?
• 0

### #9 TcM

TcM

CC Mentor

• VIP Member
• 7563 posts

Posted 23 March 2008 - 01:29 AM

Well I don't know... but the code was always there... thats why I asked you... can't understand why you did not see it.
• 0

### #10 chili5

chili5

CC Mentor

• Expert Member
• 3038 posts
• Programming Language:Java, C#, PHP, JavaScript, Ruby, Transact-SQL
• Learning:C, Java, C++, C#, PHP, JavaScript, Ruby, Transact-SQL, Assembly, Scheme, Haskell, Others

Posted 24 March 2008 - 08:10 AM

Well it's working for me now. I was trying to add something to this, to keep the number of guesses. Here's my code, i think i got it working where it shows the number of guesses.

```
<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
var num = Math.floor(Math.random() * 101);
function guessnum(){
var guess = document.forms['form1'].num.value;
var count = 0;
if (guess == num)
{
alert("Great you Guessed! How did you know that?");
count += 1
document.getElementById('counter').innerHTML = "Congratulations! you guessed the number!

It took you " + count + " guesses to win.";
}
if (guess < num)
{
alert("No your number is too low!");
count += 1;
document.getElementById('counter').innerHTML = "Number of guesses: " + count;

}
if (guess > num)
{
alert("No your number is too  high");
count += 1;
document.getElementById('counter').innerHTML = "Number of guesses: " + count;

}
}
</SCRIPT>
<title>Guess the Number</title>
</head>
<body>
<form name="form1">
Enter a number <input type="text" size=5 maxlength=3
name="num"> <input type="button" onClick="guessnum();"
value="Enter">
</form>
<div id="counter">

</div>
</body>
</html>

```

actually the counter doesn't really work, it only gets to 1 guesses and doesn't work, could someone help me fix this help?
• 0

### #11 TcM

TcM

CC Mentor

• VIP Member
• 7563 posts

Posted 25 March 2008 - 04:11 AM

Well I don't know why, but your code does not show any dialog, but it's pretty simple, your value of count is remaining 1 because. you are declaring it as 0 within the function, so whenever you press the button it declares it 0 and then increases it by 1, then again you press the button and it declares it as 0 and increases it by one, so just declare out of the function it's self, below the num variable.

I made this code for you hope it helps:

```<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
var num = Math.floor(Math.random() * 101);
var count = 0;
function guessnum()
{
var guess = document.forms['form1'].num.value;
if (guess == num)
{
count+=1;
alert("Great you Guessed! took you" + count);
}
if (guess < num)
{
count+=1;
alert("No your number is too low! Count " + count);
}
if (guess > num)
{
count+=1;
alert("No your number is too  high Count " + count);
}
}
</SCRIPT>
<title>Guess the Number</title>
</head>
<body>
<form name="form1">
Enter a number <input type="text" size=5 maxlength=3 name="num"> <input type="button" onClick="guessnum();" value="Enter">
</form>
<div id="counter">

</div>
</body>
</html>```

• 0

### #12 chili5

chili5

CC Mentor

• Expert Member
• 3038 posts
• Programming Language:Java, C#, PHP, JavaScript, Ruby, Transact-SQL
• Learning:C, Java, C++, C#, PHP, JavaScript, Ruby, Transact-SQL, Assembly, Scheme, Haskell, Others

Posted 25 March 2008 - 12:24 PM

Thanks that seems to be rather silly, but now that you point out my error it makes sense, I'm not sure why it's not displaying dialog it worked for me this morning.

And I got it to show on the page how many guesses the user took.

Thanks again
• 0

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download