• 0

Javascript annoyance with jquery


Question

I'm trying to load only certain elements of a page using the load() funcion, loading both the content on the right side of the page and the menu elements.

$(document).ready(function() {

	$('#navigation li a').click(function(){

		var toLoad = $(this).attr('href')+' #rightblock';
		var toLoadnav = $(this).attr('href')+' #leftblock';
		$('#rightblock').hide('fast',loadContent);
		$('#load').remove();
		$('#header').append('<span id="load">Loading</span>');
		$('#load').fadeIn('normal');

		function loadContent() {
                        $('#main').remove();
			$('#rightblock').load(toLoad,'',showNewContent())
		}
		function showNewContent() {
			$('#rightblock').show('normal',hideLoader());
		}
		function hideLoader() {
			$('#load').fadeOut('normal');
		}
                $('#leftblock').load(toLoadnav);
		return false;		
	});
});

#leftblock is the menu div, and #rightblock is the content div.

The annoyance is that it only works the first time I click on a menu item. The second time it'll ignore the function and load the whole page, and then obviously it'll work again... rinse, repeat :wacko: apparently the click method is no longer assigned to the #navigation div (which resides inside #leftblock) once it reloads, although on the other hand, launching the .load() from an onclick event fails exactly the same way :unsure:

Any ideas?

Link to comment
Share on other sites

3 answers to this question

Recommended Posts

  • 0

Instead of .click(), right?

It seems to be exactly what I need, but .live('click', function() [...]) doesn't seem to want to bind with $('#navigation li a'), it doesn't work at all :( I must be doing something wrong.

Link to comment
Share on other sites

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.