Bonjour,

Je vous explique mon problème. Sur ma page d'accueil, j'ai un <div> à gauche avec des titres d'article et dans chaque titre, un lien <a href> pour lire l'article dans un autre div à droite.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $('a').click(function(e){
     e.preventDefault();
     $("#lirenews").load($(this).attr('href'));
  });
});
</script>

la suite avec le lien

while ($data=mysqli_fetch_array($result)) {
			$id = $data['id'];
			if (strlen($data['titre']) > 70) {
				$chaine = substr($data['titre'], 0, 70);
				$last_space = strrpos($chaine, " ");
				$titre = substr($chaine, 0, $last_space)."...";
			} else {
				$titre = $data['titre'];
			}
			$date_publication = date('d-m-Y', strtotime($data['date_publication']));
			echo "<div class = 'titresnews'><img style='margin: 0 5px -7px 0' src='./articles/images/".$data['icone'].".png' alt='".$data['icone']."' title='".$data['icone']."'/>".$titre."<a href='lirenews.php?id=".$id."'> Lire l'article</a><br /><br />";
			echo "<span class='texte10'> [ Article original publié le ".$date_publication." ]</span> - <a class='texte10' href='".$data['source']."' target='_blank'>Voir la source</a>";
			echo "</div>";
		}

et le <div> pour lire 

<div id="lirenews"></div>

Tout fonctionne avec Jquery qui envoie bien l'article entier dans le <div> de droite quand je clique sur un lien du <div> de gauche. Mon souci est que la navigation sur mon site se fait par un menu horizontal composé de... <a href>

Donc quand je suis sur ma page d'accueil et que je clique sur un lien du menu horizontal, ce dernier s'ouvre dans mon <div> de droite. C'est très logique mais bien entendu, ce n'est pas ce que je souhaite. Quelqu'un pourrait m'expliquer comment contourner ce problème ? genre afficher dans le div de droite que pour le lien 'Lire l'article'.

Merci par avance pour votre aide

Bonjour,

à quoi ressemble ton html ? Il faut que ton sélecteur JS ne cible que les liens dans la div de gauche, donc ajoute-lui une classe ou un id de cette div.

Lamecarlate a écrit:

Bonjour,

à quoi ressemble ton html ? Il faut que ton sélecteur JS ne cible que les liens dans la div de gauche, donc ajoute-lui une classe ou un id de cette div.

Bonsoir,

Ca fonctionne parfaitement avec une classe. Je te remercie encore.

Question subsidiaire même si ce n'est peut-être pas le bon forum. Quand j'arrive sur ma page d'accueil, j'ai mes titres à gauche et rien à droite tant que je n'ai pas cliqué sur un lien à gauche. Du coup, je me retrouve avec un gros pavé vide à droite de ma page. J'ai essayé avec un #lirenews {display: none} et un #lirenews:target {display: block} mais ça ne fonctionne pas. Mais je prefèrerai mettre une image de fond dans le div de droite qui soit REMPLACEE (et non pas superposée par l'article) en cas de clic à gauche. Seulement je bute. Une idée ?

Bonjour,

Si je comprends bien ce que tu veux faire (je ne suis pas sur, car ton cas est très particulier).

1) Une fois que ta page est chargée dans la div de droite (pour ça load possède un callback que tu peux utiliser), il faut que tu fasses la même chose pour le lien que tu créé. Attention à bien nettoyer les évènements qui ne seront plus utilisés, et à ne pas en rajouter 10 000 sur le même élément.

2) Au lieu d'envoyer une div vide, tu envoies une div pleine.

Une autre solution serais d'utiliser un framework comme Angular, React ou Vue (je te conseillerais plutôt un des deux derniers). Mais ça vas demander beaucoup plus de compétences en js que de faire un peu de Jquery.

-
Edité par piero5673 6 octobre 2021 à 23:31:04