Solving Multiple Onload Issues with JavaScript

  • Context: Java 
  • Thread starter Thread starter Mattara
  • Start date Start date
  • Tags Tags
    Multiple
Click For Summary

Discussion Overview

The discussion revolves around resolving issues related to multiple "onload" events in JavaScript, specifically focusing on how to manage the loading of various functions in sequence with potential delays. Participants explore different methods to implement this functionality, including the use of timers and function arrays.

Discussion Character

  • Technical explanation
  • Exploratory
  • Debate/contested

Main Points Raised

  • One participant describes experiencing "hang" problems on page load, suspecting that multiple "onload" calls are causing conflicts.
  • Another participant suggests defining a JavaScript function in the header and calling it from the "onload" event to manage function execution.
  • A different participant expresses confusion about the original poster's challenges, indicating that the proposed code should suffice for loading functions in sequence.
  • There is a request for clarification on whether a timer delay between function calls is desired, which the original poster confirms.
  • One participant proposes using `setTimeout` to implement delays between function calls, providing a sample code snippet to illustrate this approach.
  • Another participant introduces a method using an array to manage function calls, suggesting that this can help consolidate the execution order of functions on page load.
  • A later reply emphasizes the unpredictability of JavaScript loading in different browsers and suggests testing across various environments to ensure consistent behavior.

Areas of Agreement / Disagreement

Participants generally agree on the need to manage function execution order but propose different methods to achieve this. There is no consensus on a single best approach, and some participants express confusion about the original poster's specific requirements.

Contextual Notes

Some participants mention the need for testing across different browsers and slower machines, indicating potential limitations in the proposed solutions that may depend on the environment.

Mattara
Messages
347
Reaction score
1
I have a certain service on an ISP. I am having a few minor "hang" problems on page load.

Im assuming this is because both have "onload" calls, as do other modifications I'm using, and this "hang" is cause by the codes all loading at once?

I want to set the different mods to load in sequence instead by using a delay. E.G.

<BODY onLoad="javascript:alert('First Action');alert('Second Action');">

but I am not sure how to go about it. If I listed the "onload" function of each modification I use, could somebody who knows what they are doing work out a code like above to specification for me and tell me where to put it?
(i presume css inline/ head tags equivalent?)

I.E

1 load "item one"
2 load "item two"
3 load "some other thing"

maybe something like this in an external js (but put where?)

CODEfunction start() {
function1();
function2();
function3();
}
window.onload = start;


Brainpower appreciated,
 
Technology news on Phys.org
Couldn't you just define a JavaScript function inside a script tag in the header, then call that function from your onLoad event?

- Warren
 
I'm confused as to what you want to do. The idea that i have is that all you want to do is load a number functions in sequence, but what is the difficulty in this? The code you posted, with the function start(), would accomplish this. Just copy the code from each of your onloads and place them inside functions defined in the html head, then call that function onload, like:

Code: 
<html>
<head>
<script language="javascript">
function func1(){
	//the code for your first onload here
	alert("func1");
}
function func2(){
	//the code for your second onload here
	alert("func2");
}
function func3(){
	//the code for your third onload here
	alert("func3");
}
function start(){
	func1();
	func2();
	func3();
}
</script>
</head>
<body onload="start()">
</body>
</html>

But this is pretty much the same as you posted, so i can't see what is exactly challenging you at this point. Do you want a timer delay between the function calls? Do you want to avoid placing the onloads inside functions?
 
-Job- said:
Do you want a timer delay between the function calls?

Mattara said:
I want to set the different mods to load in sequence instead by using a delay.

That is what I have in mind, but I'm not sure on how to accomplish it..
 
Then use setTimeout to implement a delay between function calls. Nothing very complex, like:
Code: 
<html>
<head>
<script language="javascript">
function func1(){
	alert("func1");
}
function func2(){
	alert("func2");
}
function func3(){
	alert("func3");
}
var counter = 1;
function delayedCall(){
	this["func"+counter++]();
	if(counter<4){
		setTimeout("delayedCall()", 1000);
	}
}
window.onload = delayedCall;
</script>
</head>
<body>
</body>
</html>
 
Just use toload_a('Script name'); to add functions in toload_e(). toload_e() will start on the page load.
Code: 
<html>
<head>
<script language="javascript">
function duytr(){
	alert("func1");
}
function treda(){
	alert("func2");
}
function fregt(){
	alert("func3");
}


toloadfunc=new Array();
function toload_a(funcname){
	toloadfunc[toloadfunc.length]=funcname;
}
toload_a('duytr');
toload_a('treda');
toload_a('fregt');

function toload_e(){
	if(toloadfunc){
		for(var index = 0; index < toloadfunc.length; index++)
		{
		this[toloadfunc[index]]();
		}
	}
}
window.onload = toload_e;
</script>
</head>
<body>
</body>
</html>
 
myfcr has it right (above). Each browser tends to load Javascript files and subroutines that are declared in the page header in a different (unpredictable) order, so you need to consolidate calls to each individual subroutine in one 'onload' subroutine, cause a delay at the top of the 'onload' subroutinet in order to let all the rest of them get loaded into memory, and then let the individual subroutines get called in the order you want.

You'll need to test it in several different browsers and on slower machines to make sure it works in all cases.
 

Similar threads

Java How can I read a local file into an array in JavaScript?
  • · Replies 6 ·
Replies
6
Views
4K
Java How to communicate between javascript and php?
  • · Replies 21 ·
Replies
21
Views
6K
Java Problem with code, possibly multiple extensions of JFrame
  • · Replies 5 ·
Replies
5
Views
2K
Java Searching & Displaying Items in Android App Using Java & SQL
  • · Replies 5 ·
Replies
5
Views
3K
Java Javascript multiplication tables
  • · Replies 9 ·
Replies
9
Views
4K
Java Javascript Inheritance questions
  • · Replies 9 ·
Replies
9
Views
2K
Java JavaScript: Can't figure out what's going wrong in my use of this API
  • · Replies 2 ·
Replies
2
Views
6K
Java How do you handle multiple statements in Java's for loop?
  • · Replies 2 ·
Replies
2
Views
2K
Do you want to build a website?
  • · Replies 15 ·
Replies
15
Views
3K
Java Javascript/JQuery Nav Button Highlighting
  • · Replies 2 ·
Replies
2
Views
3K