jQuery load() div that contains a script

Question

I'm trying to load a div that contains a javascript link into another div on another page (http://www.thebigkerbang.com/brand-storytellers/clients/xour-clients.html) with load(). I know load() strips out the script tag but I'm getting a bit confused with the $.getscript. I can load the div fine as I can see it in the code inspector.

loading the div from this page:

 <div id="beautific_hype_container" style="position:relative;overflow:hidden;width:700px;height:500px;"> 
    <script type="text/javascript" charset="utf-8" src="beautific.hyperesources/beautific_hype_generated_script.js?10913"></script> 
  </div>

into the div from this page:

<div class = "edgeContent"></div>

with:

 $('document').ready(function(){
  $(".beautific").click(function(){
    $(".edgeContent").load('beautific/beautific.html #beautific_hype_container', function() {   
    $.getScript('beautific/beautific.hyperesources/beautific_hype_generated_script.js?10913');
        });
      });
    });

Thanks Fredrik. That still only loads `

`and strips out the script. — Andy Nightingale, Apr 20 '13 at 15:31
Strange, I use that method myself and the script is not filtered out. Then again - I don't reference the script with `src`, I have it inline . — fredrik, Apr 20 '13 at 15:33
If you look in the browser developer tools, what is the response recieved from the server? — fredrik, Apr 20 '13 at 15:34
Apologies Fredrik, it seems to be pulling in the div with the script now. (http://www.thebigkerbang.com/brand-storytellers/clients/xour-clients.html) when you click on the first button below. :) Thanks for your patience and I know know a little about $.ajax :) — Andy Nightingale, Apr 20 '13 at 16:52
ps ;) When I use the second button to load another div (they are going to be a few Hype portfolio animations), will the previous div automatically be unloaded? — Andy Nightingale, Apr 20 '13 at 16:56
Since it loads into the same div, the old data should be discarded. Any loaded script resource might be cached by the browser though. — fredrik, Apr 20 '13 at 18:00

score 0 · Accepted Answer · answered Apr 20 '13 at 14:48

I would do it with an $.ajax() call:

$('document').ready(function(){
  $(".beautific").click(function(){
    $.ajax({
      url: "beautific/beautific.html #beautific_hype_container",
    }).done(function ( data ) {
      $(".edgeContent").html(data);
    });
  });
});

That way your script tag will also not be filtered out.

jQuery load() div that contains a script

1 Answers1