AJAX

body.onload += "XX"

Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases

•

Join Date: Feb 2005

Posts: 4

Reputation: NimbusSoftware is an unknown quantity at this point

Solved Threads: 0

NimbusSoftware NimbusSoftware is offline

Offline

Newbie Poster

body.onload += "XX"

Mar 15th, 2005

I'm trying to append a function to the body tag's onload event...

 Help with Code Tags 
 JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
<body onload="Do_This();"...>
...
...
<script....>
document.body.onload =+ " And_This();";
alert(document.body.onload);
</script>
<body onload="Do_This();"...>
...
...
<script....>
document.body.onload =+ " And_This();";
alert(document.body.onload);
</script>

The alert reports "undefinedDo_This();". The Do_This() function does load (and run) but I want both funcions to run on the onload event. The body tag is in a php "header" file that is included in the file the holds the script.

Thanks

•

Join Date: Dec 2004

Posts: 1,655

Reputation: tgreer is an unknown quantity at this point

Solved Threads: 35

tgreer

Offline

Made Her Cry

Re: body.onload += "XX"

Mar 15th, 2005

You can either define a third function, which would have the sole purpose of calling the other two functions.

Or, you can comma separate the two functions in your onload attribute.

Or, you can concantenate them with the "&&" operator:

Help with Code Tags

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)

<body onload="return (Do_This() && Do_That())" >

(which is a useful construct if the functions return booleans).

Lastly, you can just include the "And_This()" function in a separate script body at the very end of your document. It will run "inline" when the browser encounters it.

•

Join Date: May 2005

Posts: 182

Reputation: alpha_foobar is an unknown quantity at this point

Solved Threads: 3

alpha_foobar alpha_foobar is offline

Offline

Junior Poster

Re: body.onload += "XX"

May 2nd, 2005

This page demonstrates a technique that can be used to add functions to a body onload, or similar attribute. The beauty of this is that it can be used in situations where your project does not control ownership of the header section of the page, but you want to assign onload or similar behaviours to a page, without destroying the behaviour that already exists.

 Help with Code Tags 
 JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
<html> 
 
	<head>
 
		<script type="text/javascript">
		function Do_This(){ alert("hello world"); }
		</script>
 
 
		<title>test</title>
	</head>	
	<body onload="Do_This();" onunload="Do_This();">
 
		<h1>hello world</h1>
		...
		...
		<script type="text/javascript">
			var oldFunction = null;
			function And_This(){ 
				if(oldFunction){ oldFunction(); }
				alert("tuna fish"); 
			}
			function closingFunction(){ 
				if(oldUnloadFunction){ oldUnloadFunction(); }
				alert("closing"); 
			}
			function loadBody(){
				oldFunction = window.onload;
 
				window.onload = And_This;
				alert(window.onload);
			}
 
			var oldUnloadFunction = null;
			function unloadBody(){
				oldUnloadFunction = window.onunload;
 
				window.onunload = closingFunction;
				alert(window.onunload);
			}
 
			loadBody();
			unloadBody();
		</script>
	</body>
</html>
<html> 

	<head>

		<script type="text/javascript">
		function Do_This(){ alert("hello world"); }
		</script>
		
		
		<title>test</title>
	</head>	
	<body onload="Do_This();" onunload="Do_This();">
	
		<h1>hello world</h1>
		...
		...
		<script type="text/javascript">
			var oldFunction = null;
			function And_This(){ 
				if(oldFunction){ oldFunction(); }
				alert("tuna fish"); 
			}
			function closingFunction(){ 
				if(oldUnloadFunction){ oldUnloadFunction(); }
				alert("closing"); 
			}
			function loadBody(){
				oldFunction = window.onload;
				
				window.onload = And_This;
				alert(window.onload);
			}
			
			var oldUnloadFunction = null;
			function unloadBody(){
				oldUnloadFunction = window.onunload;
				
				window.onunload = closingFunction;
				alert(window.onunload);
			}
			
			loadBody();
			unloadBody();
		</script>
	</body>
</html>

What happens here is the loadBody and unloadBody functions are called inline when the page is being drawn. At this stage the body.onload attribute has been set (you access this using the window.onload attribute). If you print this attribute, you will notice that it is a function, with the initially defined onload function forming the body of the function. This way the javascript engine preserves the arguments that have been provided.

The loadBody function then stores the current function in a global pointer variable. That can then be called as a function in the newly defined onload function.

This has been tested in Internet Explorer 6.0.2800.1106 and Mozilla Firefox 1.0.3 with build string: Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.7.7) Gecko/20050414 Firefox/1.0.3