Reputation: 591
This might be a simple answer, but I am having some issues writing this little load script… I think I have a bug somewhere, I can get it to clear the div, however the page is not loading:
Jquery:
$(document).ready(function() {
//Load content
$(".load").click(function(){
$("#content").empty();
loadName = $(this).find("a").attr("id");
$("#content").load("/content/" + loadName + ".php");
});
});
HTML:
<div id="select">
<div id="menu">
<ul>
<li><a class="load" href="javascript:void(0)" id="project1">Project 1</a></li>
<li><a class="load" href="javascript:void(0)" id="project2">Project 2</a></li>
</ul>
</div>
</div>
<div id="content"></div>
both the php files are located at a link like so (note these are just dummy names and not actual links):
http://www.hostname.com/content/project1.php
http://www.hostname.com/content/project2.php
Upvotes: 1
Views: 314
Reputation: 49344
since you defined $('.load')
, you don't need to do find('a')
for $(this)
. Just use $(this).attr('id')
Upvotes: 2
Reputation: 31761
I think your loadName line should be this:
var loadName = $(this).attr("id"); // didn't see a declaration in your code
Upvotes: 2
Reputation: 4196
jquery's find() "does not search the selected elements, only their descendants."
Looks like you already have "this" pointing at your "a" elements, so get rid of the find().
Upvotes: 1