Forum d'entraide PHPFrance

Bonjour,
je voudrai avoir un contenu qui s'affiche au clic et qu'un bloc est ouvert les autres blocs soit masqué.
Mais rien ne fonctionne.

<?php
<?php
function debut($id, $title)
{
?>
<table cellpadding="0" cellspacing="0">
<tr>
<td width="30" valign="top">
<a href="javascript:ouvrir('<?php echo $id;?>');">
<img src="./img/up.png" border="0" id="img_<?php echo $id;?>" /></a>
</td>
<td width="90%">
<h1><?php echo $title;?></h1>
<div style="display:none;" id="<?php echo $id;?>" class="spin-content">
<?php }
function fin_section() {
?>
</div>
</td>
</tr>
</table>
<?php }
function intercalaire() { ?>
<script>
function ouvrir(element) {
	imgobj= document.getElementById("img_"+element);
	divgobj= document.getElementById(element);
	if(imgobj.src.match("./img/up.png"))
	{
		imgobj.src = "./img/down.png";
		divobj.style.display="block";
	} else {
		imgobj.src = "./img/up.png";
		divobj.style.display="none";
	}
}
</script>
<?php }?>


<html>
<head><?php intercalaire();?></head>
<body>
<?php debut('un', 'première partie'); ?>
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
<?php fin_section();?>

<?php debut('deux', 'deuxième partie'); ?>
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
<?php fin_section();?>

<?php debut('trois', 'troisième partie'); ?>
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
<?php fin_section();?>
</body>
</html>

Code : Tout sélectionner

	imgobj= document.getElementById("img_"+element);
	divgobj= document.getElementById(element);
	if(imgobj.src.match("./img/up.png"))

ce test n'a pas l'air de fonctionner, mais comment tester l'égaliter d'une chaine en javascript ?
Merci

ce test n'a pas l'air de fonctionner, mais comment tester l'égaliter d'une chaine en javascript ?

As tu essayé avec l'opérateur " == " ?

Tu dis que "ca n'a pas l'air de fonctionner" ... ca doit pourtant pas être trop dur de voir si cela fonctionne (résultat attendu correpond aux attentes) ou pas (pas de résultats, messages d'erreur, etc.)

Sinon je vois bien le code pour afficher/masquer un élément et inverser la flèche, mais je ne vois nul part ou il est appellé, ni ne voit de code pour fermer les autres éléments ouverts.

j'ai tester, mais j'aimerai faire un isset comme en php, mais je ne connais les méthodes.
j'ai revu mon script pour le test.

<?php
function debut($id, $title)
{
?>
<table cellpadding="0" cellspacing="0">
<tr>
<td width="30" valign="top">
<a href="javascript:void(0);" onclick="ouvrir('<?php echo $id;?>');">
<img src="./img/up.png" border="0" id="img_<?php echo $id;?>" /></a>
</td>
<td width="90%">
<h1><?php echo $title;?></h1>
<div id="<?php echo $id;?>">
<?php }

function fin_section() {
?>
</div>
</td>
</tr>
</table>
<?php }

function intercalaire() { ?>
<script>
function ouvrir(element) {	
	var imgobj= document.getElementById("img_"+element); // id de l'image
	var divgobj= document.getElementById(element); // id du lien et du div
	var img_up=imgobj.src.match("./img/up.png");
	if(img_up)
	{
		imgobj.src = "./img/down.png";
		divobj.style.display="block";
	} else {
		imgobj.src = "./img/up.png";
		divobj.style.display="none";
	}
}
</script>
<?php }?>

<html>
<head><?php intercalaire();?></head>
<body>
<?php debut('un', 'première partie'); ?>
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
<?php fin_section();?>

<?php debut('deux', 'deuxième partie'); ?>
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
<?php fin_section();?>

<?php debut('trois', 'troisième partie'); ?>
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
bla blabla blabla blabla blabla blabla blabla blabla bla<br />
<?php fin_section();?>
</body>
</html>

Sinon je vois bien le code pour afficher/masquer un élément et inverser la flèche, mais je ne vois nul part ou il est appellé, ni ne voit de code pour fermer les autres éléments ouverts.

justement c'est ce que je n'arrive pas à faire
c'est vrai que l'id de la flèche est le même que le block de texte à afficher et masquer
et
il y a plus simple comme ceci

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Document sans titre</title>
<script type="text/javascript">
function display(calque)
{
	// on définit la variable style qui prend la valeur du style actuel du calque.
	var style=document.getElementById(calque).style.display;
	// on évalue la valeur de style
	if (style == "none")
	{
	// si le calque est masqué on l'affiche
	document.getElementById(calque).style.display="block";
	}
	else
	{
	document.getElementById(calque).style.display="none";
	}
}
</script>	
</head>
<body onload="display('toto'); display('titi');">
<a href="#" onclick="display('toto');">
	Travail en solo ;-))
</a><br />
<div id="toto" style="display:block">
Lorem ipsum sit amet, consecdrgdggdf Lorem ipsum sit amet, consecdrgdggdf Lorem ipsum sit amet, consecdrgdggdf Lorem ipsum<a href="sfsdfs"> sit amet, consecdrgdggdf Lorem ipsum sit amet</a>, consecdrgdggdf Lorem ipsum sit amet, consecdrgdggdf Lorem ipsum sit amet, consecdrgdggdf Lorem ipsum sit amet, consecdrgdggdf Lorem ipsum sit amet, consecdrgdggdf Lorem ipsum sit amet, consecdrgdggdf Lorem ipsum sit amet, consecdrgdggdf 
</div>
<a href="#" onclick="display('titi');">
	Travail d'équipe ;-))
</a>

<div id="titi" style="display:block">
Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache  
</div>
<p>dfgdfgdfgd</p>
</body>
</html>

Mais je ne comprend comment faire pour afficher un seul block à la fois, donc au clic fermer les autres block ?
Merci

edit
j'ai tout refais donc sa fonctionne pour afficher masquer un block à la fois.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Document sans titre</title>
<script type="text/javascript">
function display(calque)
{
	// on définit la variable style qui prend la valeur du style actuel du calque.
	var style=document.getElementById(calque).style.display;
	// on évalue la valeur de style
	if (style == "none")
	{
	// si le calque est masqué on l'affiche
	document.getElementById(calque).style.display="block";
	}
	else
	{
	// sinon il est ouvert on le ferme
	document.getElementById(calque).style.display="none";
	}
}
</script>	
</head>
<?php 
function debut($id, $titre) { ?>
<a href="javascript:void(0);" onclick="display('<?php echo $id;?>');"><?php echo $titre;?></a><br />
<div id="<?php echo $id;?>" style="display:block">
<?php }?>

<body onload="display('toto'); display('titi');">
<?php debut('toto', 'Travail d\'équipe'); ?>
<!--
<a href="javascript:void(0);" onclick="display('toto');">
	Travail en solo ;-))
</a><br />-->
Lorem ipsum sit amet, consecdrgdggdf Lorem ipsum sit amet, consecdrgdggdf Lorem ipsum sit amet, consecdrgdggdf Lorem ipsum<a href="sfsdfs"> sit amet, consecdrgdggdf Lorem ipsum sit amet</a>
</div>
<?php debut('ssss', 'ddddddddddddd'); ?>
Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop fort la partie de cache cache Trop 
</div>
</body>
</html>

j'ai tester, mais j'aimerai faire un isset comme en php, mais je ne connais les méthodes.

il me semble qu'il suffit de faire simplement

Code : Tout sélectionner

if (variable) {...}

On ma donné la réponse ma manière de faire n'était pas bonne

Code : Tout sélectionner

<html>
	<head>
		<title>Voila ton code</title>
		<script language="javascript">
		function change(pos)
		{	
			tabLib = document.getElementById('menu');
			content = tabLib.getElementsByTagName('div');
			for (i = 0; i < content.length; i++)
			{
				(i == pos) ? (content[i].style.visibility = 'hidden') : (content[i].style.visibility = 'visible');
			}
		}
		</script>
	</head>
	<body>
		<div onclick="change(0);">show</div>
		<div onclick="change(1);">show</div>
		<div onclick="change(2);">show</div>
		<div onclick="change(3);">show</div>
		<div id="menu">
			<div>1</div>
			<div>2</div>
			<div>3</div>
			<div>4</div>
		</div>
	</body>
</html>

Merci à jypees de developpez.com

Forum d'entraide PHPFrance

contenu avec intercalaire

contenu avec intercalaire

Re: contenu avec intercalaire