Jump to content
Sign in to follow this  
empire

JavaScript - Guessing Game by empire

Recommended Posts

I created this myself some years ago as I was learning as an student. I gotta say it has been some year now and I forgotten the main factors. This is an simple Guessing Game script that's been put together ( had an A+ for it :)) by myself and I thought I share it with others :)

Do you want to see an preview? then Click Here and visit my website of the full game :)  

Here is the full code, Play around with it yourself :) 

<!doctype html> 
<html lang="en">  

<html>

<head>
    
<meta charset="utf-8">
<title>Bayside Gamers Guessing Game</title>
<script>window.onload=function(){
    document.getElementById("output").innerHTML = "Please Enter your Number";
};

var theNumber = Math.floor(Math.random()*100+1);
var numGuesses = 0;


function checkguess()
{
   var guess = document.getElementById("guess");
   var output = document.getElementById('output');	 
	 
     var myNumber = guess.value;
	 
	 numGuesses++; 
	 
	 
     if (isNaN == null || myNumber == "") 
	 {
		document.getElementById("output").innerHTML = "Box must be filled out";
        alert("Please Enter your number");             
     } 	 
	 if (myNumber < theNumber)
	 {
	     document.getElementById("output").innerHTML = "Too low, please try again.";
         // alert("Too Low! Try again.");
	 } 
	 else if (myNumber > theNumber)
	 {
	     document.getElementById("output").innerHTML = "Too high, please try again.";
	     // alert("High Low! Try again.");
	 } 
	 else if (myNumber == theNumber)
	 {
	    document.getElementById("output").innerHTML = "Congrats you win! "+numGuesses+ 
	         " tries! Play again... ";
		  alert("The number was " + theNumber + "! You Won After " 
		      + numGuesses + " Guesses!");
		  theNumber = Math.floor(Math.random()*100+1);  // This Line make the game to restart without refreshing
		      numGuesses = 0;
    }

}		  
	
              // This disable Right click on mouse option 
var message="What are you trying to do? You are being spied on!"; 
    function clickIE4(){ if (event.button==2){ alert(message); return false; } } 
    function clickNS4(e){ if (document.layers||document.getElementById&&!document.all){ 
             if (e.which==2||e.which==3){ alert(message); return false; } } } 
             if (document.layers){ document.captureEvents(Event.MOUSEDOWN); document.onmousedown=clickNS4; } 
             else if (document.all&&!document.getElementById){ document.onmousedown=clickIE4; } document.oncontextmenu=new Function("alert(message);return false")


</script>
</head>

  

<centered><body>
<h1>Bayside Gamers Guessing Game</h1>	</body>


<form>
  A Number From 1 to 100:
         
<input id="guess" type="text" size="8" /><br />
<input type="button" value="Guess" onclick="checkguess()" /><br />
<p id="output"></p>
</form>

 

So, what can be improved? do you guys have any ideas on CSS or whatnot that can improve the game or layout?

This is an learning skill for newbies also, So hope this helps. PS: I'm not very good explaining each line of what they mean :P 

Edited by empire

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...