views:

1749

answers:

3

When I run this in Chrome (ver 2), it doesn't return the string, but it works in Firefox (ver 3). Why is this?

<html>
<head>
<script type="text/javascript">
function disp_prompt() {
    var name=prompt("Please enter your name","Harry Potter");
    if (name!=null && name!="") {
        document.write("Hello " + name + "! How are you today?");
    }
}
</script>
</head>
<body>

<input type="button" onclick="disp_prompt()" value="Display a prompt box" />

</body>
</html>
+9  A: 

don't use document.write. if you change it to soemthing like

if (name != null && name != "") {
    document.getElementById('foo').innerHTML = "Hello " + name + "! How are you today?";
}

<body>
<input ...

<div id='foo'> </div>
</body>

document.write has pretty strange behavior. Where do you expect the text to be written to?

Jimmy
document.write is so 1995
Kent Fredric
I think there's an extra bracket after "! How are you today?".
Steve Harrison
Oh. I just got started learning javascript via web tutorials. thanks for the tip!
ehfeng
I thought the text was just supposed to be written to the browser window.
ehfeng
+2  A: 

Just add some paragraph tags in the write call:

<html>
<head>
<script type="text/javascript">

function disp_prompt() {
    var name = window.prompt("Please enter your name", "Harry Potter");
    if (name) {
        window.document.write("<p>Hello " + name + "! How are you today?<\/p>");
    }
}
</script>
</head>
<body>

<input type="button" onclick="disp_prompt()" value="Display a prompt box" />

</body>
</html>
+16  A: 

To append content to a document, you should only call document.write() during the <script>-block parsing phase.

If you have a call to document.write somewhere where it executes outside that context, such as in your event handler, there is no parsing going on, so nowhere for that string 'foo' to go.

What should happen according to the original JavaScript reference is:

Event handlers execute after the original document closes, so the write method implicitly opens a new document of mimeType text/html if you do not explicitly issue a document.open method in the event handler.

That is, it assumes you've made a mistake and meant to do:

document.open('text/html');
document.write(html);

Which replaces the entire document with new content. You'll also notice that because you didn't finish that off by calling:

document.close();

...in Firefox, the ‘loading’ throbber is still animating, expecting more content to be written to the document (but it never comes).

In this case, you are document.write()ing a string:

Hello bobince! How are you today?

that is clearly not a valid HTML document. Chrome (and Safari, which behaves the same) is trying to parse it as an HTML document, but fails because it is non-whitespace text content outside the document element (<html>), which is not allowed. If you put some tags in the name input:

Hello <em>bobince</em>! How are you today?

You'll see everything outside the <em> element is discarded. Firefox and IE manage to apply their “fix up text outside any element” broken-HTML-rule to save you, but Chrome doesn't.

If you want to document.write() a new document, you should make sure it is indeed a complete document:

<html><head><title>Greetings</title><body><p>Hello bobince! How are you today?</p></body></html>

Or, if you want to document.write() a text string, you should theoretically call:

document.open('text/plain');

before the write(). But beware, the mimetype parameter is not supported by Chrome or Safari; they'll always treat what you write as HTML.

In any case, you probably don't want to be using this method. If you want to add to (or change) the existing page you should normally be using DOM methods, such as setting the text on a status output div, or replacing the body contents using innerHTML.

document.write() is needed in a few places (in particular, when you are creating a new window or frame from scratch), but otherwise it's generally the wrong thing and should be viewed with suspicion.

bobince
wow...that was a really thorough response!
ehfeng