IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

DIV qui se cache mais qui ne se montre pas


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre confirmé
    Inscrit en
    Mars 2010
    Messages
    76
    Détails du profil
    Informations forums :
    Inscription : Mars 2010
    Messages : 76
    Par défaut DIV qui se cache mais qui ne se montre pas
    Bonjour,
    je vous soumet un petit problème sur lequel je suis bloqué depuis mnt qq heures et donc je ne comprends tjs pas la signification.
    Donc selon un choix dans une liste déroulante, on affiche ou non le contenu d'un div.
    Mais avec le code ci-dessous, tant que je choisis une valeur dans la liste qui permet d'afficher le div, celui reste afficher, quand je choisis une valeur qui doit le cacher, il se cache mais une fois cacher, quand je choisis une valeur qui est censé relafficher, ben il reste cacher
    Et le truc le plus énervant, c'est que j'ai déjà utilisé ce code pour une vingtaine d'autres cas qui marchent très bien alors que la, ben non :

    dans le <head><script> :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
     
    function cacher_pc() { document.getElementById('pc').style.display = 'none'; }
    function montrer_pc() { document.getElementById('pc').style.display = ''; }
    dans le corps :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
     
    <select name="select_type_pc" on_change="if(this.value>=2) {montrer_pc();} else {cacher_pc(); }">
    ...
    <?php
              echo '<div id="pc">';
              echo 'test';
              echo '</div>';
    ?>
    PS : le on_change est mal écrit exprès parce que je n'arrive tjs pas à éditer correctement mes messages sur ce forum

  2. #2
    Expert éminent

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Par défaut
    Bonjour,

    Pourquoi ceci ?

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
     
    on_change="..."
    //au lieu de
    onchange="..."
    Ensuite, est-on certain que le this.value >= 2 ?

    Et finalement, le vide n'est pas une valeur totalement acceptée pour le display:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
     
    style.display = 'none'; //cacher
    style.display = 'block';  //montrer
    style.display = 'inline'; //montrer
    Possible que ce soit aussi une question de position.

  3. #3
    Membre confirmé
    Inscrit en
    Mars 2010
    Messages
    76
    Détails du profil
    Informations forums :
    Inscription : Mars 2010
    Messages : 76
    Par défaut
    Yop vermine !

    Alors pour le onchange, je l'ai expliqué dans le PS de mon premier message

    Pour le test dans le onchange, il marche sans problème, j'avais fais le test de remplacer l'appel des fonctions par différents alert

    Ta dernière proposition est interessante, je vais la tester

    Tiens aussi avant de la tester je tiens à préciser que c'est un pb qui concerne IE8 seulement, le code de mon premier message marche tres bien sous FF

  4. #4
    Membre confirmé
    Inscrit en
    Mars 2010
    Messages
    76
    Détails du profil
    Informations forums :
    Inscription : Mars 2010
    Messages : 76
    Par défaut
    Bon, ben verdict :

    que l'on mette '', 'inline' ou 'block', cela marche avec FF, pas avec IE

  5. #5
    Expert éminent

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Par défaut
    Ouep, je cherche en vain une page Internet qui explique bien les différences entre navigateurs et entre "langages" concernant cette propriété.
    Faut déjà bien se rendre compte que des éléments XHTML sont inline ou bien block. Et que ça n'a rien avoir avec la propriété CSS display.
    Et de plus, IE a (selon ses versions) des distinctions quant aux éléments qui acceptent la valeur inline ou bien block.
    Mais, me semble-t-il, la valeur vide n'est pas (n'était pas ?) une norme W3C.

  6. #6
    Membre confirmé
    Inscrit en
    Mars 2010
    Messages
    76
    Détails du profil
    Informations forums :
    Inscription : Mars 2010
    Messages : 76
    Par défaut
    Dis, tant qu'on est sur cacher et révéler des divs, j'ai une autre question ^^

    Quand je mets du texte, des morceaux de formulaires (input, select...), voir les deux dans un div, j'arrive à les cacher ou à les révéler de cette manière mais quand je veux cacher ces mêmes données avec un div qui sont dans une cellule de tableau html <td>, je n'arrive plus à les cacher du tout, une idée de comment y arriver ??

    ca donne ca si j'ai pas était clair

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
     
    <div> echo 'blabla'; </div> // J'arrive à cacher le blabla
    <div><td> echo 'blabla'; </td></div> // Je n'y arrive plus

  7. #7
    Expert éminent

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Par défaut
    Euh, je ne me souviens plus.

    En attendant, ce code-ci fonctionne sur IE7:


    Code js : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
     
    <script>
    function cacher_pc() { document.getElementById('pc').style.display = 'none'; }
    function montrer_pc() { document.getElementById('pc').style.display = ''; }
    </script>

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
     
    <select onchange="if(this.value>=2) {montrer_pc();} else {cacher_pc(); }">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    </select>
     
    <div id="pc">test</div>

    Donc au démarrage, le <div> est affiché. Quand on choisi 2, 3 ou 4, il s'affiche. Quand on choisi 1, il se cache.

  8. #8
    Expert confirmé
    Avatar de le_chomeur
    Profil pro
    Développeur informatique
    Inscrit en
    Février 2006
    Messages
    3 653
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : Février 2006
    Messages : 3 653
    Par défaut
    sémantiquement parlant un td est un conteneur unique, avec comme seul parent possible un TR ou TH a aucun moment tu ne dois mettre une td dans une div

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Réponses: 34
    Dernier message: 24/09/2014, 20h26
  2. [Free Pascal] Ligne qui se répète mais qui n'est pas nécessaire
    Par Jijidev dans le forum Free Pascal
    Réponses: 4
    Dernier message: 03/01/2013, 14h15
  3. fenetre showmessage qui se cache
    Par chourmo dans le forum Langage
    Réponses: 2
    Dernier message: 30/11/2005, 14h19
  4. Un formulaire qui se cache... comment y remedier?
    Par SpyesX dans le forum Access
    Réponses: 2
    Dernier message: 19/10/2005, 17h31
  5. Une table qui existe mais qui est inconnu! ?
    Par Nino dans le forum InterBase
    Réponses: 6
    Dernier message: 13/06/2003, 11h47

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo