Rene Terstegen
Rene Terstegen

Reputation: 8046

Only load a part of a page with jQuery

I have a wordpress website and want to load my pages using jquery. I only want to load the content div, so I pass this the url like this:

var url = $(this).attr('href') + "#content";

Now when I try to load the page using ajax it loads the url without the #content part. Now it loads the complete page into my div instead of only the part that I want.

Maybe it has something to do with my .htaccess:

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
# RewriteRule ^index\.php$ - [L]
RewriteRule ^(index\.php/?|intro.html)$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

Any ideas?

Upvotes: 5

Views: 6556

Answers (3)

kaz
kaz

Reputation: 1943

You can use something like that:

$.get(url,function(response){
 content = $("#content",response);
 $('#newContentHere').append(content);
});

Upvotes: 4

Derek
Derek

Reputation: 4931

I think you need a space before the hash.

Here is a .load() example from the jQuery docs:

$('#b').load('article.html #target');

so in your case:

var url = $(this).attr('href') + " #content";

$('#containerDiv').load(url);

Upvotes: 4

malificent
malificent

Reputation: 1441

you'll have to parse the data returned by the ajax call with jquery.

So if the div you want to show on your page has an id of "results", your success function would look something like this:

success: function(data) {
    $("content").html($(data).find("results").html());
}

Upvotes: 0

Related Questions