CODEWITHSUNDEEP
jqueryajaxget
LonelyWebCrawler
LonelyWebCrawler

Reputation: 2906

Confused about jQuery $.get and $.load

On my site, I would like to implement AJAX page loading, as seen on Facebook, Twitter, and the comparatively smaller site Kotaku Gaming.

Basically, this is what I want to do: have a header that remains static throughout all pages on the domain, and only load content into a specific container, using AJAX and jQuery.

jQuery's $.load() is almost perfect— but only almost. This is basically the code I'd use:

$("#content").load("site.html");

However, when another page is "loaded" with this function, the URL does not change. This will ruin bookmarking as well as linking, and is therefore unacceptable. The URL needs to change.

The problem with $.get() is that the header does change along with the rest of the page, which of course is not what I'm looking for.

Can anybody please help me accomplish this? If the sites mentioned above can do it, why can't I?

Upvotes: 4

Views: 104

Answers (2)

Mercurybullet
Mercurybullet

Reputation: 889

If you want the URL to change with each page load but want the header to stay the same, it may be worth just creating a template for the header and then changing the content section of each page.

If you are using something link PHP, this should be pretty simple with an include/require or similar.

Upvotes: 0

SpoonNZ
SpoonNZ

Reputation: 3829

The first answer on How can I change the page URL without refreshing the page? should do the trick for you - using pushstate to push the new address. Note this won't work in older browsers, I'd suggest the best theory is to fall back to traditional methods then.

Upvotes: 1

Related Questions