Javascript in ajax loaded page

**legend.raju** · 07-21-2010, 10:22 AM

Hey, my site's setup is like this
<html>
<div> content </div>
<a id="a1"> a </a>
<script>
get("a1").onclick = load "response" to content div innerHTML;
get("a2").onclick = load "a diff response" to content div innerHTML;
</script>
</html>

The file that is loaded is in a sub folder ./contents/sample/index.php
now in that "sample/index.php" I included something like this
<a id="a1">click here</a>

This is not working ..!
Im using the jquery.load() function to call the ajax page. As far as my knowledge, by loading ajaxed content to innerHTML, css and javascript should work if defined in the main index file and not in the file being fetched.

**jscheuer1** · 07-21-2010, 03:58 PM

Use jQuery's live() to assign events to content that might show up later.

Also make sure that when importing content you are not ending up with more than one element with a given id on the page.

**legend.raju** · 07-21-2010, 07:08 PM

Solved it .....
I was using jQuery load()

the bug was here in the function declaration

i declared like this

window.onload = function(){

get("link").click = loadAjax;
function loadAjax(menu){
$.load()// to get content
}
}

so the file that is loaded was not able to access the function .. So put that out of the onload event handler.
then it worked...

Have one more doubt.
this worked when using jQuery
the ajax loaded page :
<a id="aa" onclick="abc()">aaa</a>
<script>
function abc(){
alert("came here");
}
</script>

and this did not work
in the main page
<script>
window.onload = function(){
$('a').click(clickHandler);
}
function clickHandler() {
$.load(url);
}
</script>

and in the ajaxloaded page
<a>xxx</a>

Thread: Javascript in ajax loaded page

Thread Tools

Search Thread

Javascript in ajax loaded page

Thanks

Bookmarks

Bookmarks

Posting Permissions