Cacher un élément chargé en ajax à son chargement

**Kaaribou** · 18/02/2013, 09h53

Bonjour à tous,

après multiple test et recherche, je n'arrive pa résoudre mon problème.
Voila j'ai une page main.html prinpale où est chargée mes .js avec mes fonctions ajax jquery.
Dans cette page j'ai des onglets qui en fonction d'où l'on clique charge une page x.html dans une div.

J'aimerai pouvoir cacher certains éléments de la page x.html à son chargement.

J'arrive à utiliser la fonction click avec le .on('click', ...) mais impossible de cacher l'élément avec un .hide(), et la fonction .on('load', ...) ne marche pas noonplus.

Voila j'espere avoir été clair, merci pour vos réponses.

Bon dev à tous!

**andry.aime** · 18/02/2013, 10h31

Montre nous ton code.

A+.

**Kaaribou** · 18/02/2013, 11h13

Bonjour andry.aime,

Je vous remercie pour cette redirection et vous presente mon code.

Voici le code de ma page principale :

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<html>
 <head>
  <script type="text/javascript" src="/js/jquery-1.8.2.js"></script>
  <script src="/events_load.js" type="text/javascript"></script>
 </head>
 <body>
   <div id="centre">
       Bienvenue cher utilisateur !
   </div>
   <div class="foot"> 
      <!-- ... -->
   </div>
  </body>
</html>

Voici le code de la page html que je charge dans la div "centre" de la page principale en ajax lors d'un clique sur un lien :

Code html :

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

1
2
3
4
5
6
7
<table id="tab">
 
</table>
 
<div id="menu">
    <!-- Code... -->
</div>

J'aimerai qu'aux chargement de ce code, en fonction d'une condition, pouvoir cacher les éléments "#tab" et "#menu".

Je peux manipuler tous les éléments chargés à l'aide du .on() mais uniquement lorsque qu'ils sont chargés. Je n'arrive pas à lever des évenements au chargement d'élement chargé dynamiquement dans ma page dans mon fichier "events_load.js".

Merci pour votre aide

Cordialement Kaaribou.

**Kaaribou** · 13/03/2013, 14h55

Bonjour à tous,

Après quelques touffes de cheveux en moins et un bon plongeon dans le code existant tellement propre

, j'ai enfin trouvé ma solution finalement toute bête que je partage pour tous les têtes en l'air (comme moi

) et pour résoudre ce post.

Voici ce que j'avais avant comme lien :

Code :

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

<a href="javascript:aff_centre('mapage.html')"> Ma belle page</a>

Ce qui me permettait d'ouvrir ma page dans la div '#centre' mais je n'avais pas accès aux éléments de cette page chargée.

Voici ma solution :

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
<html>
<head>
     <script type="text/javascript" src="/js/jquery-1.8.2.js"></script>
</head>
<body>
<a href="#" id="link_mapage" >Ma belle page</a>
 
<div id="centre">
     Bienvenue cher utilisateur !
</div>
<div class="foot"> 
     <!-- ... -->
</div>
 
<script>
$(document).ready(function(){
     $('#link_mapage').click(function()
     {
          var pageHtml = "mapage.html";
 
          $.get(pageHtml, function(data){
               //Charge la page html dans le conteneur spécifié
               $('#centre').html(data);
               // Execution au chargement de la page
               $('#menu').hide();
               $('#tab').hide();
          });
     });
 
     /*Ensuite on dit merci à la fonction .on()*/ 
     $('#centre').on('click', '#element_de_mapage', function(){
          alert('Yes j\'ai accès !!!!!!!');
     });
});
</script>
 
</body>
</html>

Cacher un élément chargé en ajax à son chargement [AJAX]

jQuery

Discussions similaires

Partager

Partager