Jump to content

onDivLoad


ldsmike88

Recommended Posts

I'm using AJAX to load a php page in a div. I need the php page to be able to execute a javascript function when it loads. The problem is that the normal <body onload> doesn't work. I have tried all of the normal stuff. How do I make this work? Thanks!

 

Michael

Link to comment
Share on other sites

1) Search the ajax returned info for a script /script tag.

2)  If found, extract out the code minus the script /script tags

3) eval() that code - do not eval() the script /script tags themselves

4) If the javascript code uses document.write then you must redirect the output of that to your own function before the last step because of the context in which the the eval() is executed.  If you do not, then you will get weird results like the output of the document.write overwriting the entire page.

5) Reset the document.write afterwards

6) You can now push the output of the eval() into a div

7) If the info returned by ajax contains mixed html/ javascript, then you will have to parse out the straight html as well and save that and then concat it with the output of the javascript before pushing it into the div.

 

Here's a regular expression used for finding script tags. I lifted this directly from prototype.js and it works great.  It contains capturing subexpression parentheses so you can easily separate the code from the script /script tags.

scriptregexp = /(?:<script.*?>)(?\n|\r|.)*?)(?:<\/script>)/im;

 

use code like this:

var curscript = ajaxreturnvalue.match(scriptregexp);

if (curscript) { // script tag found!
    // the 2 statements below are necessary if the code uses
    // document.write - I redirect to a function which will write it to a var
    var savewrite = document.write;
    document.write = mywrite; // mywrite is a function defined below
    writtenstring = ''; // reset document.write var

    // the curscript[1] var below is only the part between the script tags
    // not including the script tags, do not use the actual script tags in eval()
    eval(curscript[1]);

    // restore the document.write event below
    // if any document.write statements were executed
    // the result will be in the global var 'writtenstring'
    document.write = savewrite;

   // delete the script from the code returned
   ajaxreturnvalue = ajaxreturnvalue.replace(scriptregexp, '');
   // or replace with redirected output of document.write
   ajaxreturnvalue = ajaxreturnvalue.replace(scriptregexp, writtenstring);
}

 

and you'll need this function and global var

var writtenstring = ''; // initialize

function mywrite(writevalue) {
    writtenstring += writevalue; //add to end of string 
}

 

--No easier ways of doing this are provided in native javascript or ajax.

Link to comment
Share on other sites

SWEET! I got it to work... but I didn't do it the way you gave me. I tried the script you gave me but I had to edit it around a bit to make it work. I guess I just don't understand regular expressions and I have no clue what prototype.js is. Although my script doesn't fix the document.write function like yours does, mine still works pretty dang good. Here is how I made it work:

 

function findJS(ajaxreturnvalue){
var javascriptFound = ajaxreturnvalue.match('<script>');

if(javascriptFound){
	var ajaxreturnvalue = ajaxreturnvalue.split('<script>');
	var ajaxreturnvalue = ajaxreturnvalue[1].split('</script>');
	var ajaxreturnvalue = ajaxreturnvalue[0];
	eval(ajaxreturnvalue);
}
}

 

THANKS mainewoods!

Link to comment
Share on other sites

Nice.  More than one way to skin a cat.  I guess your scripts don't use the document.write.  If they did it would generate an error.  I see posts here many times talking about ajax returning html + javascript simultaneously.  You would use the same general method but make it a little more complicated.

 

Prototype.js is the famous free javascript library for doing ajax and for making js dom manipulation easier.

 

http://www.prototypejs.org/

 

 

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.