[JQuery] Trouble replacing inline HTML with external HTML page

Hi,

I'm a novice with javascript though I've hacked scripts before to satisfy my own requirements - however this is too tricky for me to work out alone. Any help or guidance to solving this is very much appreciated.

So I'm looking to throw up a popup lightbox on my page after a few seconds delay. The code I have is:


<script type='text/javascript' src='jquery.js'></script>
<script type='text/javascript' src='lightbox.js'></script>

<script type="text/javascript">
var popup_domination = {"defaults":{"Name":"Your First Name...","Email1":"Your Email Address..."},"delay":2,"cookie_time":1,"center":"Y","cookie_path":"\/","show_opt":"open","unload_msg":"Would you like to signup to the newsletter before you go?","impression_count":0,"output":"<div class=\"popup-dom-lightbox-wrapper\" id=\"popup_domination_lightbox_wrapper\" style=\"display:none\">my content goes in here<\/div>"};
</script>


You'll notice the content is inline, but what I'd like to do is use an external HTML file - it saves me having to escape all the HTML within the javascript y'see...

I'm guessing the "output":"<div class=\"popup-dom-lightbox-wrapper\" id=\"popup_domination_lightbox_wrapper\" style=\"display:none\">my content goes in here<\/div>" is what I need to change - but how could I load and external HTML file in here instead?

Many thanks,

Rob.

You would have to use AJAX for that. jQuery actually makes that very easy; it would look something like that:

$.get('/url/of/the/file.html', function (html) {
// Whatever you want to do. The html parameter holds the contents of your HTML file.
});