JQuery.load () - Internal external Javascript
Load external page with
$('#myContainer').load('myfile.html');
in myfile.html theres
<script type="text/javascript" src="otherscript.js"></script>
Some users report that the othercript.js file is not loaded ... I tested all common browsers (firefox i.e. 6/7, safari, opera, etc.) - I can't figure out why this doesn't work. ...
another think that ... according to my firebug the browser will not cache othercript.js .. it is loaded with
otherscript.js? _ = 1234785
(timestamp here :))
Anyone have an idea why some browsers don't support this and ... how can I enable this caching?
MFG Christopher
source to share
The .load functions only load html. As you are not allowed to load external scripts into browser by browser security protocol. But luckily there is a .getScript to get around this. Check it out: http://docs.jquery.com/Ajax/jQuery.getScript
.. Fredrik
source to share
to avoid cache problems you can do the following:
$('#myContainer').load('myfile.html?'+(new Date()).getTime());
in myfile.html:
<script type="text/javascript">
var script = document.createElement("script");
script.setAttribute('type','text/javascript');
script.setAttribute('src','otherscript.js?'+(new Date()).getTime());
document.body.appendChild(script);
</script>
adapting this code to your needs.
source to share
As fredrik pointed out, .load does not load external files, however it will pipe the result to html to execute whatever javascript is there.
I had a similar problem and came up with this solution, which fetches script tags from results that have a src attribute and then uses $ .getScript to load the attribute value.
$('#exmple').load(url, function(result) {
$(result).filter('script[src]').each(function () {
var script = $(this).attr('src');
$.getScript(script);
});
});
source to share