[jQuery] Need Simplest Ajax
Hello all, I'm new to JavaScript and jQuery although I have been
learning for a couple of weeks now but still can't wrap my head around
the programming this kind of stuff... I'll basically post my HTML
below and explain to you what I need and where I am stuck. Thank you
for reading!
Okay, So I have a basic index.html here:
<div id="navigation">
<a class="current" id="index" title="Home" >Home</a>
<a href="contact.html" id="contact" title="Contact">Contact</a>
<a href="#" id="Misc" title="Misc">Misc Additional Nav Link</a>
</div><!-- </navigation> -->
<div id="content">
This is my content
</div><!-- </content> -->
Here is what I want:
Since I am on the homepage, the link is inactive through the use of
the current class and of course without a href, however, when someone
would click on Contact, jquery would load the content and insert it
into the content div and update the navigation to show the following
inside it:
<a href="index.html" id="index" title="Home" >Home</a>
<a class="current" id="contact" title="Contact">Contact</a>
<a href="#" id="Misc" title="Misc">Misc Additional Nav Link</a>
Here's the script:
$(document).ready(function() {
$('#contact').click(function() {
$('#content').load('contact.html');
return false;
$('#navigation').text("Hello! What do I do here?");
});
});
I have contemplated putting the whole navigation inside the 'text'
function with my desired changes for /each/ navigation item but my gut
feeling is that it's stupid and redundant to do so and there has to be
a better way for it...Perhaps a loop or something calling the variable
clicked on like e.currentTarget in ActionScript 3? I appreciate you
taking the time for reading my jquery adventure and hope you can help
me out.
Cheers! :-)