Closed Thread Icon

Topic awaiting preservation: How to show the loop result on the same page? (Page 1 of 1) Pages that link to <a href="https://ozoneasylum.com/backlink?for=8689" title="Pages that link to Topic awaiting preservation: How to show the loop result on the same page? (Page 1 of 1)" rel="nofollow" >Topic awaiting preservation: How to show the loop result on the same page? <span class="small">(Page 1 of 1)</span>\

 
Hiroki
Paranoid (IV) Inmate

From: NZ
Insane since: Dec 2002

posted posted 06-05-2003 00:12

Hi, guys. How are you today?
Well, I am playing with JS for a couple of weeks so far. Pretty taugh on me.
Never mind.
I have got a question. Would you have time to read this?

My mission:

quote:
Write a program that output(down the page) 10, 9, 8...1 blastoff! User can input starting number.



Here is my code:

code:
<html>
<head>
<script type="text/javascript">
function cal(){
for(i=document.theForm.num.value; i>0; i--)
{
document.write(i + " ");
}
document.write("Blast Off");
}
</script>
</head>
<body>
<form name="theForm">
<input type="text" name="num" onblur="cal()">
</form>
</body>
</html>



This code is sort of fine. But I want to show the result under the input box not on the new page. When I run the code, the result appears wihtout input text box.

Hmm.....Would you know what I mean??? Many thanks for reading.
Looking forward to hearing from you.
Cay.

JavaScript Lover,

Hiroki Kozai

bitdamaged
Maniac (V) Mad Scientist

From: 100101010011 <-- right about here
Insane since: Mar 2000

posted posted 06-05-2003 01:09

yeah document.write rewrites the whole page from the beginning.

do this, put an empty div under the input

<div id="output"></div>


and then change this line to this

document.write(i + " ");

to this

document.getElementById('output').innerHMTL = i + " ");

That should do it.



.:[ Never resist a perfect moment ]:.

Hiroki
Paranoid (IV) Inmate

From: NZ
Insane since: Dec 2002

posted posted 06-05-2003 01:39

Hi, Bitdamaged!
Many thanks for your reply.
I changed my code. But still have a problem.
Actually I am not sure what you mean this:

quote:
put an empty div under the input

<div id="output"></div>



What I did is below:

code:
<html>
<head>
</head>
<body>
<p>Number     Square     Cube</p>

<script type="text/javascript">
function cal(){
for(i=document.theForm.num.value; i<=10; i++)
{
document.getElementById('output').innerHMTL = i + " ");
document.getElementById('output').innerHMTL = i*i + " ");
document.getElementById('output').innerHMTL = i*i*i + " ");
document.write("<br />");
}
}
</script>

<form name="theForm">
<input type="text" name="num" onBlur="cal()">
<div id="output"></div>
</form>
</body>
</html>



Hmm....Probably that div is being placed wrong place??!, isn't it?

Hiroki Kozai

[This message has been edited by Hiroki (edited 06-05-2003).]

bitdamaged
Maniac (V) Mad Scientist

From: 100101010011 <-- right about here
Insane since: Mar 2000

posted posted 06-05-2003 05:27

nah the div is fine. There's a couple of problems.

First you spelled innerHTML wrong.
Second you want to concatenate to the innerHTML value.
Third document.write the break tag kills your whole page after the first loop.

code:
<html>
<head>
</head>
<body>
<p>Number Square Cube
</p>
<script type="text/javascript">
function cal(){
for(i=document.theForm.num.value; i<=10; i++) {
document.getElementById('output').innerHTML += i + " ";
document.getElementById('output').innerHTML += i*i + " ";
document.getElementById('output').innerHTML += i*i*i + " ";
}
}
</script>
<form name="theForm">
<input type="text" name="num" onBlur="cal()">
<div id="output">
</div>
</form>
</body>
</html>





.:[ Never resist a perfect moment ]:.

Hiroki
Paranoid (IV) Inmate

From: NZ
Insane since: Dec 2002

posted posted 06-05-2003 23:51

Hi, Bitdamaged. Good morning.
How are you today?
Many many thanks for your helps. I am really glad to hear from you.
Well, it is sort of working fine. I am pleased about it.
But I just wonder.....
You said:

quote:
Third document.write the break tag kills your whole page after the first loop.



As you know, when I run the script, my output is just on one row. But if I want to break the line, how can I do that??? Please give me a tip!!!


Hiroki Kozai

Veneficuz
Paranoid (IV) Inmate

From: A graveyard of dreams
Insane since: Mar 2001

posted posted 06-06-2003 23:29

Instead of using document.write to add the line break, you can add it the same as you add the other text. Just the replace the document.write line with:

document.getElementById('output').innerHTML += "<br />";

_________________________
"There are 10 kinds of people; those who know binary, those who don't and those who start counting at zero"

« BackwardsOnwards »

Show Forum Drop Down Menu