简体   繁体   中英

Problems with dynamically loading external js files on a onload event

I'm trying to get lightbox2 working with my site, http://www.therussianfrostfarmers.com/ , however i seem to be having a problem with conflicting external js files. I'm not entirely sure i know where the problem is with this code, but i believe its got todo with how the onload events are called. the blog content on the homepage is loaded into iframe, the iframe is dynamically resized to fit the content using the onload event, but when i import the files required for lightbox2 (as per normal)....

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

....it cancels my updateSize() being called on the iframe. lightbox2 does still work.

I've narrowed the problematic js file to the prototype.js.

I've tried handling the sequence of events with the function dhtmlLoadScript(). Using the following code, the page loads properly, the iframe resizes properly, but then the page turns white and firefox loading icon just keeps spinning.

<script type='text/javascript'>
// function to resize iframe
function updateSize() 
{ 
    // get width
    frame_x = $('#content').width() -5; 

    // apply width 
    $('#iframed').css('width', frame_x); 


    //get height
    var the_height = document.getElementById('iframed').contentWindow.document.body.scrollHeight +120;

    //apply height
    document.getElementById('iframed').height = the_height;

}

// function to load external js files 
function dhtmlLoadScript(url)
{
   var e = document.createElement("script");
   e.src = url;
   e.type="text/javascript";
   document.getElementsByTagName("head")[0].appendChild(e);
}

// function to handle each event on onload callback 
function callbackHandler()
{
   updateSize();
   dhtmlLoadScript("http://www.therussianfrostfarmers.com/ndxz-studio/site/js/prototype.js");
   dhtmlLoadScript("http://www.therussianfrostfarmers.com/ndxz-studio/site/js/scriptaculous.js?load=effects,builder");
   dhtmlLoadScript("http://www.therussianfrostfarmers.com/ndxz-studio/site/js/lightbox.js"); 
} 

</script>

<iframe src='$url' frameborder='0' id='iframed' onload="callbackHandler()"></iframe>

Sorry if anything is unclear.

Thanks Cam

快速检查一下,看看函数名称updateSize()是否未在原型中重新映射

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM