clodo0683 clodo0683 - 1 month ago 5
HTML Question

Reload the content of a Div using jquery/ajax

I have one page and I would like to reload Divs without refresh my page when I click on menu links, at this time I'm using the following, but it doesn't work:

$(".hidemenubook4").load(location.href + " #book4");


My page has 4 different divs that I want to reload when I click on links to open them:

<a class="hidemenubook1" id="launcherbook1b" data-fancybox-group="book1" href="javascript:void(0);"><span class="namebook1origin">Book1</span></a>
<a class="hidemenubook2" id="launcherbook2b" data-fancybox-group="book2" href="javascript:void(0);"><span class="namebook2origin">Book2</span></a><br/>
<a class="hidemenubook3" id="launcherbook3b" data-fancybox-group="book3" href="javascript:void(0);"><span class="namebook3origin">Book3</span></a><br/>
<a class="hidemenubook4" id="launcherbook4b" data-fancybox-group="book4" href="javascript:void(0);" onClick="parent.jQuery.fancybox.close();"><span class="namebook4origin">Book4</span></a><br/>

<div id="book1"><div class="thumbnails">
<a class="fancyboxgallerybook4" data-fancybox-group="book4" href="http://www.domaine.com/wp-content/uploads/book0/4.jpg" title=""><img class="fancyboxthumbnailsgallerybook4" src="http://www.domaine.com/wp-content/uploads/book4/07.jpg" alt=""/></a>
...
</div></div>
<div id="book2"><div class="thumbnails">
<a class="fancyboxgallerybook4" data-fancybox-group="book4" href="http://www.domaine.com/wp-content/uploads/book0/4.jpg" title=""><img class="fancyboxthumbnailsgallerybook4" src="http://www.domaine.com/wp-content/uploads/book4/07.jpg" alt=""/></a>
...
</div></div>
<div id="book3"><div class="thumbnails">
<a class="fancyboxgallerybook4" data-fancybox-group="book4" href="http://www.domaine.com/wp-content/uploads/book0/4.jpg" title=""><img class="fancyboxthumbnailsgallerybook4" src="http://www.domaine.com/wp-content/uploads/book4/07.jpg" alt=""/></a>
...
</div></div>
<div id="book4"><div class="thumbnails">
<a class="fancyboxgallerybook4" data-fancybox-group="book4" href="http://www.domaine.com/wp-content/uploads/book0/4.jpg" title=""><img class="fancyboxthumbnailsgallerybook4" src="http://www.domaine.com/wp-content/uploads/book4/07.jpg" alt=""/></a>
...
</div></div>

Answer

You're trying to load the content into .hidemenubook4 which is the <a> link!

Not sure what you mean to do with something called "hidemenubook", but to load the content, use:

$("#book4").load(location.href + " #book4");

if you mean to do this on the anchor click, then:

$(".hidemenubook4").click(function() {
    $("#book4").load(location.href + " #book4");
});
Comments