I need help with my code

**NitroDev** · 10-22-2013, 07:22 PM

So yeah in this code it wont get past the "menu" when i press the Play button can you guys help me?

Code:

<html>
<body>
<div id="mydiv">
<script>
function myInventory()
{
document.write('<pre>');
document.writeln("A warm blanket");
document.writeln('<button onClick="newWorld()">Back</button>');
		{
		document.getElementById('mydiv').innerHTML = '';
		}
}
function newWorld()
{
document.write('<pre>');
document.writeln("<h1>Hello and welcome to World of My Core!</h1>");
document.writeln("What would you like to do?");
document.writeln('<button onClick="myInventory()">Inventory</button>');
		{
		document.getElementById('mydiv').innerHTML = '';
		}
}
</div>
</script>

<h1>Welcome to My Core</h1>
<p>Start by choosing your name</p>

<form action="">
Username: <input type=" text" name="Username"><br>
</form>
<p>Then choose your gender</p>

<form>
<input type="radio" name="gender" value="Male">Male<br>
<input type="radio" name="gender" value="Female">Female
</form>

<p>Press the Play button to play!<p>

<button onClick="newWorld()">Play</button>
</body>
</html>

**traq** · 10-22-2013, 09:04 PM

You have a </div> tag inside your script.

**NitroDev** · 10-23-2013, 09:27 AM

Originally Posted by traq

You have a </div> tag inside your script.

Now it wors but not how i liked it to work. Run the code in your browser and check my problem

**molendijk** · 10-23-2013, 11:12 AM

Using document.write in a function that executes after page load destroys the page (including lines for functions). That's why your functions don't work.
I don't know exactly what you want. I made the following, which may be what you have in mind:

<!doctype html>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title> </title>

<script>
function myInventory()
{
document.body.innerHTML="<pre>A warm blanket<button onClick='newWorld()'>Back<\/button><\/pre>"
}
function newWorld()
{
document.body.innerHTML="<pre><h1>Hello and welcome to World of My Core!<\/h1>What would you like to do?<button onClick='myInventory()'>Inventory<\/button><\/pre>"
}
</script>

<style>
pre{font-family: arial; font-size: 12px}
</style>
</head>

<body>
<h1>Welcome to My Core</h1>
<p>Start by choosing your name</p>

<form >
Username: <input name="Username"><br>
</form>
<p>Then choose your gender</p>

<form>
<input type="radio" name="gender" value="Male">Male<br>
<input type="radio" name="gender" value="Female">Female
</form>

<p>Press the Play button to play!<p>

<button onClick="newWorld()">Play</button>
</body>
</html>

**NitroDev** · 10-23-2013, 01:19 PM

Arie You are my hero now!! Thanks alot dude your the best

What about when i want a new button or a line do i use the document.body.innerHTML again?

**molendijk** · 10-23-2013, 02:31 PM

Originally Posted by NitroDev

What about when i want a new button or a line do i use the document.body.innerHTML again?

Yes, but it may depend on what you want to add.

**NitroDev** · 10-23-2013, 06:04 PM

well i want to add a button to the next line of the code like in here

Code:

<!doctype html>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>&nbsp;</title>

<script>
function craft()
{
document.body.innerHTML"<pre><p>What do you want to craft?<\/p><\/pre>"
}
function explore()
{
document.body.innerHTML="<pre><h1>Where do you want to explore?<\/h1><button onClick='newWorld()'>Back<\/button><\/pre>"
}
function myInventory()
{
document.body.innerHTML="<pre><h1>This is your inventory"
document.body.innerHTML="<pre>A warm blanket<button onClick='newWorld()'>Back<\/button><\/pre>"
}
function newWorld()
{
document.body.innerHTML="<pre><h1>Hello and welcome to World of My Core!<\/h1>What would you like to do?<button onClick='myInventory()'>Inventory<\/button><button onClick='explore()'>Explore<\/button><\/pre>"
document.body.innerHTML="<pre><button onClick='craft()'>Craft<\/button><\/pre>"
}
</script>

<style>
pre{font-family: arial; font-size: 12px}
</style>
</head>

<body>
<h1>Welcome to My Core</h1>
<p>Start by choosing your name</p>

<form >
Username: <input name="Username"><br>
</form>
<p>Then choose your gender</p>

<form>
<input type="radio" name="gender" value="Male">Male<br>
<input type="radio" name="gender" value="Female">Female
</form>

<p>Press the Play button to play!<p>

<button onClick="newWorld()">Play</button>
</body>
</html>

**molendijk** · 10-23-2013, 07:26 PM

You mean this?

<!doctype html>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title> </title>

<script>
function craft()
{
document.body.innerHTML="<pre><p>What do you want to craft?<\/p><\/pre>"
}
function explore()
{
document.body.innerHTML="<pre><h1>Where do you want to explore?<\/h1><button onClick='newWorld()'>Back<\/button><\/pre>"
}

function myInventory()
{
document.body.innerHTML="<pre>A warm blanket<button onClick='newWorld()'>Back<\/button><\/pre>"
}
function newWorld()
{
document.body.innerHTML="<pre><h1>Hello and welcome to World of My Core!<\/h1>What would you like to do?<button onClick='myInventory()'>Inventory<\/button><button onClick='craft()'>Craft<\/button><\/pre>"

}
</script>

<style>
pre{font-family: arial; font-size: 12px}
</style>
</head>

<body>
<h1>Welcome to My Core</h1>
<p>Start by choosing your name</p>

<form >
Username: <input name="Username"><br>
</form>
<p>Then choose your gender</p>

<form>
<input type="radio" name="gender" value="Male">Male<br>
<input type="radio" name="gender" value="Female">Female
</form>

<p>Press the Play button to play!<p>

<button onClick="newWorld()">Play</button>
</body>
</html>

**NitroDev** · 10-23-2013, 07:52 PM

well yeah but in a different line than the inventory button

**molendijk** · 10-23-2013, 08:09 PM

Like this?

<!doctype html>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title> </title>

<script>
function craft()
{
document.body.innerHTML="<pre><p>What do you want to craft?<\/p><button onClick='newWorld()'>Back<\/button><\/pre>"
}
function explore()
{
document.body.innerHTML="<pre><h1>Where do you want to explore?<\/h1><button onClick='newWorld()'>Back<\/button><\/pre>"
}

function myInventory()
{
document.body.innerHTML="<pre>A warm blanket<button onClick='newWorld()'>Back<\/button><\/pre>"
}
function newWorld()
{
document.body.innerHTML="<pre><h1>Hello and welcome to World of My Core!<\/h1>What would you like to do?<br><button onClick='myInventory()'>Inventory<\/button><br><button onClick='craft()'>Craft<\/button><\/pre>"

}
</script>

<style>
pre{font-family: arial; font-size: 12px}
</style>
</head>

<body>
<h1>Welcome to My Core</h1>
<p>Start by choosing your name</p>

<form >
Username: <input name="Username"><br>
</form>
<p>Then choose your gender</p>

<form>
<input type="radio" name="gender" value="Male">Male<br>
<input type="radio" name="gender" value="Female">Female
</form>

<p>Press the Play button to play!<p>

<button onClick="newWorld()">Play</button>
</body>
</html>