bonjour,
je fais appel à vous, car après multiple recherche je ne trouve pas de solution à mon problème. Pour l'expliquer en quelques mots je suis en train de concevoir un site avec un menu accordéon à 3 niveaux.
Menu
->sous-menu
Menu
->sous-menu
->sous-sous menu

Le menu est fait sans soucis, l'effet accordéon est fait aussi avec l'aide de la classe JQuery. Mais le hic est que j'aimerais que lorsque l'on clique sur sous-menu ou sous-sous menu une page se charge dans une div avec un include, et cela je n'arrive pas à le faire.
En espérant avoir été assez clair dans mon explication,et dans l'attende de votre réponse,
Passez une bonne journée

PS: voici le code de ce que je fais. J'ai inclus la solution que j'avais envisagé, le lien se met bien à la place du span mais quand je clique sur le menu la page ne se charge pas

$(document).ready( function () { 
        // On cache les sous-menus 
        // sauf celui qui porte la classe "open_at_load" : 
        $("ul.subMenu:not('.open_at_load')").hide(); 
        // On selectionne tous les items de liste portant la classe "toggleSubMenu" 
     
        // et on remplace l'element span qu'ils contiennent par un lien : 
		$("li.toggleSubMenu span").each( function () { 
			// On stocke le contenu du span : 
			var TexteSpan = $(this).text(); 
			$(this).replaceWith('<a href="index.php?page=La gamme" title="Afficher le sous-menu">' + TexteSpan + '</a>') ; 
		} ) ; 
         
         
        // pareil avec submenu2 
        $("ul.subMenu2:not('.open_at_load2')").hide(); 
        $("li.toggleSubMenu2 span").each( function () { 
            var TexteSpan = $(this).text(); 
            $(this).replaceWith('<a href="index.php?page=La gamme" title="Afficher le sous-menu" >' + TexteSpan + '</a>') ; 
        } ) ; 
     
        // On modifie l'evenement "click" sur les liens dans les items de liste 
        // qui portent la classe "toggleSubMenu" : 
        $("li.toggleSubMenu > a").click( function () { 
            // Si le sous-menu etait deja ouvert, on le referme : 
            if ($(this).next("ul.subMenu:visible").length != 0) { 
                $(this).next("ul.subMenu").slideUp("normal", function () { $(this).parent().removeClass("open") } ); 
            } 
            // Si le sous-menu est cache, on ferme les autres et on l'affiche : 
            else { 
                $("ul.subMenu").slideUp("normal", function () { $(this).parent().removeClass("open") } ); 
                $(this).next("ul.subMenu").slideDown("normal", function () { $(this).parent().addClass("open") } ); 
            } 
            // On empêche le navigateur de suivre le lien : 
            return false; 
        }); 
         
        // pareil avec "toggleSubMenu2" : 
        $("li.toggleSubMenu2 > a").click( function () { 
            if ($(this).next("ul.subMenu2:visible").length != 0) { 
                $(this).next("ul.subMenu2").slideUp("normal", function () { $(this).parent().removeClass("open2") } ); 
            } 
            else { 
                $("ul.subMenu2").slideUp("normal", function () { $(this).parent().removeClass("open2") } ); 
                $(this).next("ul.subMenu2").slideDown("normal", function () { $(this).parent().addClass("open2") } ); 
            } 
            return false; 
        }); 
     
    } ) ;

<ul class="navigation"> 
		<li><a href="index.php" title="Aller à la page 1">Accueil</a></li>
		<li><a href="index.php?page=La gamme" title="Aller à la page 2">Scell-it</a></li> 			
		<li><a href="#" title="Aller à la page 3">Le catalogue</a></li> 
		<li class="toggleSubMenu"><span>La gamme</span> 
			<ul class="subMenu"> 
				<li class="toggleSubMenu2"><span>Sceller</span>
					<ul class="subMenu2">
						<li><a href="#" title="Aller à la page 2.2">Les scellés chimique</a></li> 
						<li><a href="#" title="Aller à la page 2.3">Accessoires</a></li>
					</ul>
				</li>
				<li class="toggleSubMenu2"><span>Fixer</span>
					<ul class="subMenu2">
						<li><a href="#" title="Aller à la page 2.9.1">Fixation lourde</a></li>
						<li><a href="#" title="Aller à la page 2.9.2">Fixation légère</a></li>
						<li><a href="#" title="Aller à la page 2.9.3">Fixation spécifique</a></li>					
					</ul>
				</li>
				<li class="toggleSubMenu2"><span>Clouer</span>
					<ul class="subMenu2">
						<li><a href="#" title="Aller à la page 2.11.1">Clouer dans le bois</a></li>
						<li><a href="#" title="Aller à la page 2.11.2">Clouer dans le béton</a></li>
					</ul>
				</li>
				<li class="toggleSubMenu2"><span>Riveter</span>
					<ul class="subMenu2">
						<li><a href="#" title="Aller à la page 2.11.1">Rivets aveugles</a></li>
						<li><a href="#" title="Aller à la page 2.11.2">Rivets de Structure</a></li>
						<li><a href="#" title="Aller à la page 2.11.2">Ecrous</a></li>
						<li><a href="#" title="Aller à la page 2.11.2">Outils à riveter</a></li>
						<li><a href="#" title="Aller à la page 2.11.2">Outils à sertir</a></li>
					</ul>
				</li>
				<li class="toggleSubMenu2"><span>Visser</span>
					<ul class="subMenu2">
						<li><a href="#" title="Aller à la page 2.11.1">Vis autoperceuse standard</a></li>
						<li><a href="#" title="Aller à la page 2.11.2">Vis spécial bardage</a></li>
						<li><a href="#" title="Aller à la page 2.11.2">Vis à empreinte Carrée</a></li>
						<li><a href="#" title="Aller à la page 2.11.2">Vis pour le bois</a></li>
						<li><a href="#" title="Aller à la page 2.11.2">Vis pour les plaques de plâtre</a></li>
						<li><a href="#" title="Aller à la page 2.11.2">Vis menuiserie aluminium</a></li>
						<li><a href="#" title="Aller à la page 2.11.2">Vis pour menuserie PVC</a></li>
						<li><a href="#" title="Aller à la page 2.11.2">Embout et Coffret</a></li>
					</ul>
				</li>
			</ul> 
		</li> 
		<li><a href="#" title="Aller à la page 6">Recherche et développement</a></li>
		<li><a href="#" title="Aller à la page 7">Production</a></li>
		<li><a href="#" title="Aller à la page 8">Banque média</a></li>
		<li><a href="#" title="Aller à la page 9">Contact</a></li> 				 
	</ul>

Utilise Ajax. (Avec jQuery, je crois que la méthode .load() te conviendrait bien.)

je connais pas beaucoup AJAX. Je vais essayer la méthode .load() comme tu me conseilles et je te dis quoi.

ta méthode marche impeccable.Voici le bout de code que j'ai fait avec .load() :

// On modifie l'evenement "click" sur les liens dans les items de liste 
        // qui portent la classe "toggleSubMenu" : 
        $("li.toggleSubMenu > a").click( function () {
            // Si le sous-menu etait deja ouvert, on le referme : 
            if ($(this).next("ul.subMenu:visible").length != 0) { 
                $(this).next("ul.subMenu").slideUp("normal", function () { $(this).parent().removeClass("open") } ); 
            } 
            // Si le sous-menu est cache, on ferme les autres et on l'affiche : 
            else { 
                $("ul.subMenu").slideUp("normal", function () { $(this).parent().removeClass("open") } ); 
                $(this).next("ul.subMenu").slideDown("normal", function () { $(this).parent().addClass("open") } ); 
		$("#cpage").load(this.href);
            } 
            // On empêche le navigateur de suivre le lien : 
            return false; 
        });