Probleme sur display:none;

Version imprimable

Bonjour, je tente d’adapter un petit script javascript qui fonctionne parfaitement a un code php.

Voici ce code:

Code:

1
2
3
4
5
6
7
8
9
<SCRIPT TYPE="text/javascript">	
    function showWait()
        {
    if (document.getElementById('plus1').style.display='block')
    {
    return "document.getElementById('plus1').style.display='none'"
     }
    return false
        }</SCRIPT>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
<div class="testRight">
		<a id="la_suite1" class="la_suite"  href="#debutgun" onclick="showWait();"  >
		Lire la suite</a>
	<div id="plus1" style="display:none; width:500px; " onclick="document.getElementById('la_suite1').style.display='none'; "> 
 
			Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
			tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
			quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
			consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
			cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
			proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
	</div>
</div>

Dans mon script j'ai :

Code:

1
2
3
4
5
6
7
<SCRIPT TYPE="text/javascript">	
    function showWait(){
		if (document.getElementById('plus2').style.display='block'){
			return "document.getElementById('plus2').style.display='none'"
		}
		return false
</script>

qui contient les divs et boutons

Code:

1
2
include 'content/Plus_horaire_gta.php';
include 'content/Plus_horaire_gta2.php';

dans Plus_horaire_gta.php j'ai :

Code:

printf("<input type=\"button\" class=\"btn btn-primary\" onClick=\"showWait()\" value=\"Ajouter un horraire\">");

dans Plus_horaire_gta2.php j'ai :

Code:

1
2
3
printf("<div id=\"plus2\" style=\"display:none;\">");	
......
printf("</div>");

Malgré tout ceci, le display none n'est pas pris en compte au départ
Merci de votre aide

05/02/2013, 10h45
Bovino

Code:

if (document.getElementById('plus1').style.display='block')

:roll:

Le signe =, c'est pour faire une affectation, pas une comparaison !
05/02/2013, 10h53
Invité

Oui en effet ! Merci de cette correction, mais je n'arrive toujours pas à saisir pourquoi la div #plus1 est visible malgré le display:none; au départ.
05/02/2013, 10h58
vermine

Bonjour,

J'ai l'impression qu'il y a deux fois la fonction showWait() avec une définition différente. C'est normal ?
05/02/2013, 11h16
Invité

Oui effectivement la première est celle de mon exemple qui n'est pas inclus dans mon code
05/02/2013, 11h22
vermine

Il faudrait nous donner le code HTML généré alors.
05/02/2013, 11h58
Invité

j'obtiens ceci

Code:

<div id="plus2" style="display:none;"></div>

Avant ce bout de code le display:none fonctionne mais après non....

Code:

1
2
3
4
5
6
7
8
9
printf("<table class=\"liasse_tables\">");
printf("<tr>");
	printf("<td colspan=\"9\">");
		printf("<a class=\"btn\" data-toggle=\"modal\" href=\"#myModal3\" >");
		printf("<img src=\"commun/img/aide.png\" width=\"20\" height=\"20\""); 
		printf(" alt=\"Aide sur les astreintes\"></a>");
		printf("<em>Consultez la rubrique d'aide avant de remplir ces champs</em>");
	printf("</td>");
printf("</tr>");

06/02/2013, 15h04
Invité

J'ai résolu mon problème !! en faite display:none ne fonctionne dans un élément de type table que sur les tr ou un élément de type tbody par exemple

Bonjour,

Citation:

Envoyé par clashnco

(...) en faite display:none ne fonctionne dans un élément de type table que sur les tr ou un élément de type tbody par exemple

cela marche parfaitement sur des TD également.
Code:

1 2 3 4 5 6 7 8 9 10 11 12 <table border> <tr> <td>L1C1</td> <td style="display:none">L1C2</td> <td>L1C3</td> </tr> <tr> <td>L2C1</td> <td>L2C2</td> <td>L2C3</td> </tr> </table>
Par contre une petite question
Es tu conscient que ta fonction ne masque pas l'élément mais retourne une chaine de caractère?
Code:

1 2 3 4 5 6 function showWait() { if (document.getElementById('plus1').style.display == 'block') { return "document.getElementById('plus1').style.display='none'" } return false }

Merci de la précision, oui j'en suis conscient du coup j'ai utilisé une autre fonction :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
function Affiche_OBJ(){
	var Arg = arguments; 
	var Obj;
	for( var i=0; i< Arg.length; i++){ 
		Obj = document.getElementById( Arg[i]); 
		if( Obj){
			Obj.style.visibility = "visible";
			Obj.style.display = "";
		}
	}
} 
function Masque_OBJ(){
	var Arg = arguments; 
	var Obj;
	for( var i=0; i< Arg.length; i++){
		Obj = document.getElementById( Arg[i]); 
		if( Obj){
			Obj.style.visibility = "hidden";
			Obj.style.display = "none";
		}
	}
}

Diablerie, je n'avais même pas fait attention à ça :
Code:

1 2 3 if (document.getElementById('plus2').style.display='block'){ return "document.getElementById('plus2').style.display='none'" }
Bien vu, NoSmoking.

Le return n'est pas obligatoire. Donc en gros ça donne ceci :
Code:

1 2 3 if (document.getElementById('plus2').style.display=='block'){ document.getElementById('plus2').style.display='none'; }

12/02/2013, 14h29
Invité

merci pour cette précision :ccool: