using jquery to load content

Ok here's the problem: In my index page I have 4 tabs menu, Home/Contact/About/Faq and a #content div. When I click on each of the tabs the result appears in the #content div.

The content of the Home button is already written in the Index page while all the other tabs are external pages. The following script can perfectly call external pages only.

The code:

As you can see, on the first load, "Content of home tab" is shown, if you click on FAQ, faq.php is loaded, but then I can't go back to home. How can I fix this so I could combine between showing external pages and local divs within the same index page? (one suggestion is to make the home an external page, but that's not what I want)


In my opinion, only two ways are here to do this because one the content of #content is replaced by content of other tabs, you need to fetch the content of Home page back. Now its your choice to fetch it via Ajax or normal GET request.

One is to load the content of Home tab via Ajax in index page (by loading it with jQuery's load method in document ready event handler) and in that case your current script would work as it is. But, I don't know whey you don't want this.

Another approach can be load complete index page when user clicks on Home tab. For this script would be

$(function() {
$('#nav a').click(function() {
    var page = $(this).attr('href');
    var id = $(this).attr('id');
    if (id == 'home') {
        window.location.href = "index.php";
    } else {
        $('#content').load(page + '.php');
    return false;

Need Your Help

Checking html closing tags using java


I want to check html file for closing tags in Java. If closing tags are not there then put closing tag.

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.