Replace a DIV with a HTML File

I have created a horizontal menu with 5 tab options using a ul and 5 li tags that is held inside a div

Below this area, I have also create a separate div (id="content1") that will be used to display the content html files based on the tab options selected.

What I am unsure how to accomplish using both JavaScript and jQuery, how can I through a onlick call, replace the div content1 with the html file content? Say I clicked the tab "features" - would like to replace div id content1 with features.html file content?

Any help would be great.

Thanks.

Answers


This is easy to do using jQuery and load() to load the remote content and apply it to a div.

Lucky you, there's a great tutorial that explains exactly how to do this! :)


Try something like this:

$("#features").click(function(){
   $("#content1").load('features.html');
});

Couldn't your retrieve the file contents via AJAX, and then set the contents of the div with .html()?


Need Your Help

Debug a running android app using Xamarin for Visual Studio

c# visual-studio xamarin

When the app starts I have it loading a list from local storage if offline, or if there is a network connection it will load this list from a web service (and then write to local storage.

@font-face color?

css colors font-face

I'm trying to put some specific font on the website using @font-face.

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.