Problem with global variables and buttons

V

viola823

Hi
I have a simple code where I try to change a global variable by the
function run by a button with 'onClick' event, but my solution won't
work... here's the code:

---------------------------
<html>
<head>
<script language="JavaScript">
var v = 0;
function change_v() {
v++;
}
function show_v() {
alert(v);
}
</script>
</head>
<body>
<form method="post">
<input type="button" name="b1" value="change_v()"
onClick="change_v();">
<input type="button" name="b2" value="show_v()" onClick="show_v();">
</form>

<script language="JavaScript">
document.write('v = ' + v);
</script>
</body>
</html>
---------------------------

Here:

<input type="button" name="b1" value="change_v()"
onClick="change_v();">
<input type="button" name="b2" value="show_v()" onClick="show_v();">

variable 'v' is changing and displaing correctly by the functions ,
but here:

document.write('v = ' + v);

'v' all the time equals 0...

What's wrong? Any ideas?
Thanks a lot for any suggestions!

Greets
Ps. sorry for my english:)
 
T

Thomas 'PointedEars' Lahn

<script language="JavaScript"> ^^^^^^^^^^^^^^^^^^^^^^
var v = 0; ^^^^^^^^^^
function change_v() {
v++;
}
function show_v() {
alert(v);
}
</script>
[...]
</head>
<body>
[...]
<form method="post">
Click to expand...
^^^^^^^^^^^^^^
method="post" is unnecessary if you don't submit anything. For that matter,
the `form' element is unnecessary as well.
<script language="JavaScript"> ^^^^^^^^^^^^^^^^^^^^^^
document.write('v = ' + v);
</script>
[...]
Here:

<input type="button" name="b1" value="change_v()"
onClick="change_v();">
<input type="button" name="b2" value="show_v()" onClick="show_v();">

variable 'v' is changing and displaing correctly by the functions ,
but here:

document.write('v = ' + v);

'v' all the time equals 0...

What's wrong?
Click to expand...

Nothing. It would appear that you think setting an event handler attribute
(here: onClick) makes its value execute automatically when the corresponding
element is rendered; that is not the case. The event handler code is
executed when the event occurs, not before. In this case, it is executed
when you click the button (hence "onclick").

You should also validate your markup: http://vaidator.w3.org/


PointedEars
 
V

viola823

Nothing. It would appear that you think setting an event handler attribute
(here: onClick) makes its value execute automatically when the corresponding
element is rendered; that is not the case. The event handler code is
executed when the event occurs, not before. In this case, it is executed
when you click the button (hence "onclick").
Click to expand...

So there's no any way to do it by the buttons? :/
You should also validate your markup:http://vaidator.w3.org/
Click to expand...

This code was written only for example, I wouldn't place it
elsewhere:)
 
L

Lee

(e-mail address removed) said:
So there's no any way to do it by the buttons? :/
Click to expand...

Thomas has misunderstood your problem.
It's annoying to have to pull him out of the killfile again
to see how he's confused somebody else.

When you use document.write() to display the value of a variable
on a page, it writes the current value as of the time that
document.write() statement is executed. If you later change the
value by executing an event handler, the string that has already
been written to the page will not change.

Your functions work.


--
 
T

Thomas 'PointedEars' Lahn

So there's no any way to do it by the buttons? :/
Click to expand...

Of course there is a way. It is just not the way you tried. What
document.write() writes to the document is simply static text. Even if you
write a variable value, there is no magic attached to it like a reference to
the variable. You call document.write() while the document is loading, and
the value it writes is the unchanged value of the variable.

If you want to change document content you have to use appropriate
techniques. document.write() is one of them; however, If you call
document.write() after the document has loaded, it usually overwrites the
document content, so that is probably not a viable solution here. (That
is what the VK article you referred fails to explain. Never ever rely on
what is said in one of VK's articles. His notion of Voodoo programming is
unreliable at best.)

Now there are several other techniques you may try:

- modify the `value' property of a HTMLInputElement object:

http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-6043025

Example: <input ... onclick="this.form.elements["foo"].value = v;">

- modify the standards compliant node value of a text node:

http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-F68D080

Example: document.getElementById("foo").firstChild.nodeValue = v;

- modify the proprietary `innerHTML' property of an element object

http://msdn2.microsoft.com/en-us/library/ms533897.aspx

http://developer.mozilla.org/en/docs/DOM_Client_Object_Cross-Reference:DOM_HTML

Example: document.all("foo").innerHTML = v;

All of these aproaches, which may be combined, require proper feature tests
so that they do not cause a run-time error when the required properties are
not supported:

http://www.jibbering.com/faq/faq_notes/not_browser_detect.html
This code was written only for example, I wouldn't place it
elsewhere:)
Click to expand...

It is illogical to expect non-Valid examples to work as if they were Valid.

http://diveintomark.org/archives/2003/05/05/why_we_wont_help_you


PointedEars
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

How can I arrange a series of radio buttons? 2
Script stops working when using variables to save time typing... 4
How to position the *tooltip* comment on these buttons? 9
Help with code 0
How to use a global variable within a function? 5
Song requests 4
Help me sort out this script 1
Buttons lining up 1

Members online

No members online now.
Total: 1,880 (members: 3, guests: 1,877)
Robots: 139

Forum statistics

Threads
474,159
Messages
2,570,879
Members
47,414
Latest member
GayleWedel

Latest Threads

Top