Question

I am doing an ajax request to a php page (‘test.php’)
inside of test.php is

<script type="text/javascript">
 function test() {
alert('test');
}
</script>

<div id="abc">some normal content too</div>

now this function is unique to each page load, i.e it is generated via php to do different things

so, my question is how do i call that function test();

as jquery thinks the response is just text so it does not eval it

jquery has datatypes for the return

one is script the other is html

however it does not seem to have mixed.

how can i fix this?

Answer 1

The jQuery .load() function will evaluate <script> tags in the response content, but only if your call to .load() does not involve a selector to pull part of the response out before it’s inserted in the DOM.

Thus, this call:

 $('#myContainer').load("/some/url", function() { /* ... */ });

will cause any script content to be run, but this:

 $('#myContainer').load("/some/url #stuffIWant", function() { /* ... */ });

will not. I don’t know why it works that way, but it does.

If you’re loading it the first way, understand that you won’t be able to use anything defined as a global function (or a global anything) until the loading has completed. Thus:

$('#someplace').load(url, function() { } );
newGlobalFunction("hi");

won’t work because “newGlobalFunction” won’t be defined until the asynchronous request completes. Thus, this should work:

$('#someplace').load(url, function() {
  newGlobalFunction("hi");
});

If your ajax result is nothing but that script content, you could also consider not wrapping it in <script> tags and just eval it yourself!