views:

152

answers:

2

I have 2 html files : test1 and test2

test1.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript" type="text/javascript" src="lib/jquery-1.3.2.min.js"/></script>
<script language="javascript" type="text/javascript">

$(document).ready(function(){


   $('#content').empty().load('test2.html');

});


</script>


</head>

<body>
<div id="content"></div>

</body>
</html>

test2.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<script language="javascript" type="text/javascript" src="lib/jquery-1.3.2.min.js"/></script>
<script language="javascript" type="text/javascript">

$(document).ready(function(){


  alert(202);

});

</script>


</head>

<body>
test
</body>
</html>

When I run test1 it only shows "test" and not the alert.So it cannot take in the embedded jquery. So how can I make it take? Please help.

+1  A: 

The load function always filters out everything from the referenced HTML except the body element on load. Try moving your script into the body element and see if that helps.

In jQuery 1.2 you can now specify a jQuery selector in the URL. Doing so will filter the incoming HTML document, only injecting the elements that match the selector. The syntax looks something like "url #some > selector". Default selector "body>*" always applies. If the URL contains a space it should be escape()d. See the examples for more information.

Note that you can apply a selector on load that does more extensive filtering as well.

tvanfosson
A: 

You need to put the script into the <body> on the page that you are loading.

Aleternatively, you might consider using the callback of the load() function to show the alert

$(document).ready(function(){

   $('#content').empty().load('test2.html', function() { alert(202); });

});
Russ Cam