my function is lengthy because my cms requires all the code in there to work. for instance, the code that 'removes then re-adds script.src links if you already have them in <head>' is to make some plugins, like tinyMCE.moxiecode.com, work in IE6 when it's loaded up multiple times in a row through ajax-calls. and if i get it correctly, yours only handles inline scripts, not referenced scripts...?
ricardobeat wrote:
uuh lengthy function. I came up with this for my personal library, works in FF/IE6,7/Safari: function runScripts(el){ var scripts = el.getElementsByTagName('script'); if (scripts) {for (var i=0;i<scripts.length;i++) { var script = document.createElement('script'); script.type = 'text/javascript'; script.text = scripts[i].text; document.getElementsByTagName("head")[0].appendChild(script); }}; } the 'language' attribute is deprecated in XHTML. cheers - ricardo Rene Veerman wrote:Yep, you'll have to add the javascript nodes in the HTML you're inserting into the DIV manually. WTF, i'll be a nice guy and post my routines for it. you'll have to adapt them yourself ;) function parseJavascript (htmlElement) { var scripts = $('SCRIPT', htmlElement); var htmlHead = $('HEAD')[0]; for (var i=0; i<scripts.length; i++) { var script = scripts[i]; if (script.src) { var scriptsInHead = $('SCRIPT', htmlHead); var found = false; for (var j=0; j<scriptsInHead.length && (!found); j++) { if (scriptsInHead[j].src == script.src) found = j; } var e = document.createElement("script"); e.type="text/javascript"; e.language='JavaScript'; e.src = script.src; if (found===false) { console.log ("mb.desktop.parseJavascript: appending "+e.src+" to HEAD."); htmlHead.appendChild(e); } else { console.log ("mb.desktop.parseJavascript: removing then re-adding "+e.src+" to HEAD."); scriptsInHead[found].parentNode.removeChild (scriptsInHead[found]); htmlHead.appendChild (e); } } else { var s = scripts[i].innerHTML; s = s.replace (/<!--/, ''); s = s.replace (/-->/, ''); s = s.replace (/\s\s/g, ''); //console.log (s); eval(s); } } Steve wrote:Hi, I'm a jQuery newbie. Basically, I'm trying to load an html file into a div when a button is clicked. The html file contains external .js and .css files for the Greybox widget. I can't get Greybox working, do I have to do something special to load the js and css before the load method? Appreciate any help. --------------- test.html --------------------- $(document).ready(function(){ $("#btn").click(function(){ $("#demo").load("greybox.html"); }); }); --------------- greybox.html --------------------- <script type="text/javascript"> var GB_ROOT_DIR = "greybox/"; </script> <script type="text/javascript" src="greybox/AJS.js"></script> <script type="text/javascript" src="greybox/gb_scripts.js"></script> <link href="greybox/gb_styles.css" rel="stylesheet" type="text/css" /> <a href="http://google.com/"; title="Google" rel="gb_page_fs[]">Launch google.com in fullscreen window</a>
