Help displaying things
merlin_at@merlinsrealm_dot_net
want to grab a name with I'm trying to display a hyperlink in my body, but one of
my functions overwrites it. The code is below. What am I doing wrong?
Thanks!
David
<html>
<head>
<title>
</title>
<script language="javascript" type="text/javascript">
var userName = "";
var randomMessage = "";
function loadPage()
{
userName = prompt("What is your name?", "Please enter your name");
if ((userName == "Please enter your name") || (userName == null))
{
userName = "Anonymous User";
}
document.writeln('Welcome to my web page, ' + userName);
}
function mouseIsOver(site)
{
mouseIsOverMessage = "This link will take you to www." + site;
window.status = mouseIsOverMessage;
}
function mouseIsOut(site)
{
mouseIsOutMessage = "Are you sure you don't want to give www." +
site + " a shot?";
window.status = mouseIsOutMessage;
}
function mouseHasClicked(site)
{
randomNumber = Math.floor(Math.random()*5);
switch (randomNumber)
{
case "0":
randomMessage = "Hang onto your butt, we're heading
to www." + site + "!";
break;
case "1":
randomMessage = "Destination: www." + site;
break;
case "2":
randomMessage = "www." + site + "? Energize!";
break;
case "3":
randomMessage = "Are you ready to visit www." + site
+ "? Here we go!";
break;
case "4":
randomMessage = "So, you think www." + site + " is
better?! Take a look";
break;
}
alert(randomMessage);
}
</script>
</title>
</head>
<body onLoad="loadPage();">
<h1 align="center">
Here are a few of my favorite links
</h1>
<hr />
<a href="http://www.slashdot.org" onMouseOver="mouseIsOver
('slashdot.org');" onMouseOut="mouseIsOut('slashdot.org');"
onClick="mouseHasClicked('slashdot.org');">
Slashdot
</a>
</body>
</html>
--
--------------------------------- --- -- -
Posted with NewsLeecher v3.9 Beta 1
Web @ http://www.newsleecher.com/?usenet
------------------- ----- ---- -- -
Lee
>
>Okay, I'm still really new to javascript, so I'm looking for a little help. I
>want to grab a name with I'm trying to display a hyperlink in my body, but one
>of
>my functions overwrites it. The code is below. What am I doing wrong?
>
>Thanks!
>David
>
><html>
><head>
><title>
></title>
><script language="javascript" type="text/javascript">
> var userName = "";
> var randomMessage = "";
> function loadPage()
> {
> userName = prompt("What is your name?", "Please enter your name");
> if ((userName == "Please enter your name") || (userName == null))
> {
> userName = "Anonymous User";
> }
> document.writeln('Welcome to my web page, ' + userName);
> }
1. You didn't explain clearly what it is that you're trying to do.
2. You included far too much whitespace in the code you posted.
As you can see, this makes it wrap and become difficult to read.
3. You used document.writeln() in a page that has already been
rendered. This clears the page and writes new content.
--
Darko
As Lee explained it in his 3. sentence, you rewrite your document so
none of the previous contents is left. Here's the thing - you can use
document.write(ln) in two situations:
1. <script>
function loading()
{
document.write( "bla" );
}
</script>
<body onload="loading()">
.....
</body>
In this situation, after the whole document is loaded, it executes the
given function. BUT, between these two steps the document does an
implicit .close() method of itself, so you can't write on it anymore.
If you still try, however, like we did in the loading() function, then
the document is reopened by an implicit .open() method, which rewrites
all of its contents.
2. <body>
..........
<script>
document.write( "bla" );
</script>
..........
</body>
In this situation, however, the document is parsed line-by-line, as
usual, and when it comes upon the <script> block, the document hasn't
yet finished with loading, thus it hasn't yet called the
implicit .close() method, and document.write( "bla" ) acts as we
wanted - it just inserts the "bla" string in the place where the
<script> block is. After that the rest of the document is loaded, and
we can see all the contents as we wanted it.
What you're trying to do shouldn't use document.write at all. You
should make a <div id="bla_place"></div> element in the document,
which is (as you can see) empty of contents but has an identifier
"bla_place". The loading (<body onload="loading()">) function should
look something like this:
function loading()
{
// ... you get the name by either prompt() or whatever
var bla_place = document.getElementById( "bla_place" );
bla_place.innerHTML = "Hello, " + name + "!";
}
You could of course use the DOM, instead of innerHTML, but for trivial
tasks such as this, it's really not necessary.
merlin_at@merlinsrealm_dot_net
do is simply display 2 things. The first is just a basic "Welcome to my web
site, " with the name the user enters onload. Then I just want to display a
hyperlink that includes onMouseOver(), onMouseOut(), and onClick(). I found out
that write() and writeln() clear the page, so what other options are there?
Thanks again!
~ David
Cah Sableng
> Sorry about the whitespace, I copied & pasted from my editor. What I'm trying to
> do is simply display 2 things. The first is just a basic "Welcome to my web
> site, " with the name the user enters onload. Then I just want to display a
> hyperlink that includes onMouseOver(), onMouseOut(), and onClick(). I found out
> that write() and writeln() clear the page, so what other options are there?
>
Maybe better if you quote previous messages.
> <html>
> <html>
> <head>
> <title>
> </title>
> <script language="javascript" type="text/javascript">
> var userName = "";
> var randomMessage = "";
> function loadPage()
> {
> userName = prompt("What is your name?", "Please enter your name");
> if ((userName == "Please enter your name") || (userName == null))
> {
> userName = "Anonymous User";
> }
> document.writeln('Welcome to my web page, ' + userName);
// As Darko suggested, use div element to display the message.
document.getElementById('msgArea').innerHTML = 'Welcome to my web
page, ' + userName;
> }
>
> function mouseIsOver(site)
> {
> mouseIsOverMessage = "This link will take you to www." + site;
// Use div to display messages too..
document.getElementById('msgArea').innerHTML = mouseIsOverMessage;
> }
>
> function mouseIsOut(site)
> {
> mouseIsOutMessage = "Are you sure you don't want to give www." +
> site + " a shot?";
> window.status = mouseIsOutMessage;
// this one too..
document.getElementById('msgArea').innerHTML = mouseIsOutMessage;
> }
>
> function mouseHasClicked(site)
> {
> randomNumber = Math.floor(Math.random()*5);
> switch (randomNumber)
> {
> case "0":
// type of randomNumber is number, try test it with alert(typeof
randomNumber);
// so remove double quotes surrounding the number
case 0:
> randomMessage = "Hang onto your butt, we're heading
> to www." + site + "!";
> break;
> case "1":
// this one too..
case 1:
case 2:
case 3:
case 4:
<!-- div to display the message -->
<div id="msgArea"></div>
> </body>
> </html>
Hope this help.