Remplacer les éléments enfants

**popy67** · 21/02/2013, 12h18

Bonjour tout le monde,

Petit problème avec mon code...
Je cherche via JQuery à supprimer tous les enfants de mon p#presentation , mon script effectue une requete ajax pour afficher la suite de la présentation... j'ai essayé plusieurs fonctions (html, replaceWith, empty...) sans trouver la bonne, à chaque fois le contenu retourné s'affiche en plus de celui initialement présent...
Quelqu'un aurait la solution pour moi ???

Extrait de la partie Partie JQuery :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
complete : function(xhr, result)
{
	if(result != "success") return;
	var response = xhr.responseText;
	$("p#presentation").empty();
	$("p#presentation").html(response);
}

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<p id="presentation" style="margin:-10px">
    <div style="font-size:25px; font-weight:bold; font-family:Verdana, Geneva, sans-serif; color:red; margin-left:10px">Titre</div><br /><br />
    <div style="float:left; width:200px; border:1px solid black">Image</div>
    <div style="float:right; width:440px; border:1px solid black; font-family:Tahoma, Geneva, sans-serif; font-size:15px">Titre de présentation <br />suite de la présentation</div>
    <br /><br /><br />
    <div style="float:left; width:440px; border:1px solid black; font-family:Tahoma, Geneva, sans-serif; font-size:15px">Image</div>
    <div style="float:right; width:200px; border:1px solid black">Ma presentation</div>
    <br clear="all" /><br />
    <div id="prochaine_page" data-id_page="2" style="font-size:15px; color:red; text-align:center">Suivant >> </div>
</p>

**SpaceFrog** · 21/02/2013, 13h17

regarde pluto du coté de load() ...

de plus le selecteur p#presenetation n'est pas bon ou totu du moien redondant
un id est unique sur la page =>$("#presentation").empty();

**popy67** · 21/02/2013, 15h17

Salut merci pour ta réponse.
Je commence a devenir fou, regarde mon code ci-dessous je t'ai tout copié, pour simplifier j'ai desactivé la requete ajax, je veux maintenant uniquement supprimer les enfants de div#presentation, j'utilise sont empty qui d'après la doc est censé faire ça (Doc)sauf que le texte "ce texte s'enlève" s'enlève bien mais les noeuds en dessous restent !!!
J'ai encore utilisé d'autres solutions notamment via les selecteurs :parent :nth-child etc rien ne marche

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Document sans nom</title>
<link href="css/jquery-ui-1.9.2.custom.css" rel="stylesheet" type="text/css" media="all">
<script src="js/jquery-1.8.3.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.9.2.custom.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function()
	{
		$("#prochaine_page").hover().css('cursor', 'pointer');
		$("#prochaine_page").live("click", function()
			{
			$("#presentation").empty();
			});
	});
 
</script>
</head>
 
<body>
 
 
  <p id="presentation" style="margin:-10px">
 
                                    Ce texte s'enlève.
 
                                    <div style="font-size:25px; font-weight:bold; font-family:Verdana, Geneva, sans-serif; color:red; margin-left:10px">Titre</div><br /><br />
                                    <div style="float:left; width:200px; border:1px solid black">Image</div>
                                    <div style="float:right; width:440px; border:1px solid black; font-family:Tahoma, Geneva, sans-serif; font-size:15px">Titre de présentation <br />suite de la présentation</div>
 
                                    <br /><br /><br />
 
                                    <div style="float:left; width:440px; border:1px solid black; font-family:Tahoma, Geneva, sans-serif; font-size:15px">Image</div>
                                    <div style="float:right; width:200px; border:1px solid black">Ma presentation</div>
 
 
                                    <br clear="all" /><br />
                                    <div id="prochaine_page" data-id_page="2" style="font-size:15px; color:red; text-align:center">Suivant >> </div>
 
 
                                    </p>
 
</body>
</html>

Je deviens fou