Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 30573
  • Last Modified:

append to document.onload

Hi,

How do you add a function to document.body.onload

e.g. it is currently onload="function1();"

it needs to become onload="function1(); function2();"

function2(); could be any function bane so this needs to be dynamic.

Ive tried document.body.onload =+ 'function2();' but it doesnt work, also i cant change function1(); so i cant do

function1()
{
// code
function2();
}

Any ideas appreciated.

Thanks

Dave
0
x2cmsac
Asked:
x2cmsac
1 Solution
 
x2cmsacAuthor Commented:
sorry typo 'function2(); could be any function bane so this needs to be dynamic.'  -> 'function2(); could be any function name so this needs to be dynamic.
0
 
ZvonkoSystems architectCommented:
Check this:

<body onLoad="alert(33)">
<h1>My Page</h1>
...



<script>
var oldLoad = window.onload;
window.onload=function(){
  oldLoad();
  alert(34);
}
</script>
</body>
0
 
ZvonkoSystems architectCommented:
And you have to keep in mind that you can read the onLoad first after it has been set.
That does say: you cannot read the onload handler in the body tag from a script in the head section of the page.
And the body tag assignment does overwrite all previous window.onload assignemts.



0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
x2cmsacAuthor Commented:
Ive seen an approach like that and i cant use it any other ideas?


0
 
ZvonkoSystems architectCommented:
You have to explain a bit more what you want to do.
What you CANNOT do is to concatinate onLoad handlers as Strings.
Please explain a bit more what your problem is.

0
 
x2cmsacAuthor Commented:
Ok, this is the scenario.

There will be modules which users of our company can install 'scripts' onto there website pages.

The scripts should install themselves into the HTML, in this case i need the script to install a <script src="myscript.js" reference into the head which ive done and to automatically put onload="myScriptLoad();" but some of the users pages may already have an onload event so i need to append this myScriptLoad to the existing onload.

I was considering using a regular expression to put in the new onload event into the HTML but i think it would be a bit wasteful performance wise.

Does that help?

0
 
ZvonkoSystems architectCommented:
Help what? You asked for help.
And when you read my second posting then you will see that your scenario CANNOT work.
You cannot predict in the included javascript file what the body onload handler will be because it is not assignet at that time in the header section.
The only way it would work is when the <script src="myscript.js" is added AFTER the <BODY> tag.

0
 
x2cmsacAuthor Commented:
Help you answer my ticket, you asked for the scenario.

Its a website builder this code <script src="myscript.js" is inserted into the clients HTML page using this -

var myScript = document.createElement("<SCRIPT>");
myScript.src = '/myscript.js';
myScript.type = 'text/javascript';
var myHead = document.getElementsByTagName('head').item(0);
myHead.appendChild(myScript);

So i need similar code to append myScript to onload, the code you provided

var oldLoad = window.onload;
window.onload=function(){
  oldLoad();
  alert(34);
}

i could include but it would only work in one instance, i need to this work for many different javascript module installations.
0
 
x2cmsacAuthor Commented:
This is insert javascript into HTML Source Code not a live HTML page.
0
 
ZvonkoSystems architectCommented:
Like this:

var myScript = document.createElement("SCRIPT");
myScript.src = '/myscript.js';
myScript.type = 'text/javascript';
var myBody = document.body;
myBody.appendChild(myScript);

And then my upper proposal does work:
var oldLoad = window.onload;
window.onload=function(){
  oldLoad();
  alert(34);
}


0
 
x2cmsacAuthor Commented:
Imagine having 2 browser windows one is your HTML page (WINDOW1) and the second window is a page where you can install javascript modules (using javascript) (WINDOW2)

In WINDOW2 you choose a javascript module and using javascript it installs it into WINDOW1

var myScript = WINDOW1.document.createElement("SCRIPT");
myScript.src = '/myscript.js';
myScript.type = 'text/javascript';
var myBody = WINDOW1.document.body;
myBody.appendChild(myScript);

Then how do i tell it to insert your code? and how does this work when they select another module?

var oldLoad = window.onload;
window.onload=function(){
  oldLoad();
  alert(34);
}

What im looking for is a way to append to the onload event as many times as needed not just in one case.
0
 
ZvonkoSystems architectCommented:
The script works as I proposed it.
Did you test it?
0
 
ZvonkoSystems architectCommented:
Now I see what you did not understand!
This script is in the file /myscript.js :

var oldLoad = window.onload;
window.onload=function(){
  oldLoad();
  function2(); // any function that is on WINDOW1 page or in included script files.
}

And this part is in WINDOW2:

var myScript = WINDOW1.document.createElement("SCRIPT");
myScript.src = '/myscript.js';
myScript.type = 'text/javascript';
var myBody = WINDOW1.document.body;
myBody.appendChild(myScript);




0
 
genXeratorCommented:
I know this is old, but since I struggled to figure it out, I thought I should add this... If onload can be empty, be sure to check that there is something to execute before calling the function:

if (oldLoad)
  oldLoad();
0
 
mdbanatCommented:
me too i know this is too old...but just now i read this thread..

why don't u try this:

window.attachevent("onload", function(){alert('hello..')});

add as many u want from that...



0
 
ZvonkoSystems architectCommented:
Thaks genXerator for the improvement.
I missed that befcause in original version was the assumtion that first onLoad is defined in same file. In same file you have not to check by script what you have written by hand. But in two separate files you have to check it for timing reasons.

mdbanat, you have a typo. It has to be:
window.attachEvent("onload", function(){alert('hello..')});
window.attachEvent("onload", function(){alert('hello..')});
window.attachEvent("onload", function(){alert('hello..')});

0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now