Texte apparaît si on clique sur un bouton html

Html

flav -
tarek_dotzero Messages postés 817 Date d'inscription Statut Membre Dernière intervention - 12 avril 2022 à 03:04

Salut,

Je suis en train de faire un site web et je cherche à faire dérouler un texte quand on appuie sur un bouton, et replie le texte quand on réappuie. J'ai essayé un petit truc, mais ça ne marche pas:
Je fais ça dans un doc svelte.

Pour le java script j'ai:

var bool=true;
function cache(id){
	if(bool==true){
		document.getElementById(id).style.display='none';
		bool=false;
	}else{
		document.getElementById(id).style.display='block';
		bool=true;
	}
}

et dans l'html:

  <div id="aCacher">texte test</div>  
 <button on:click={cache('aCacher')} class="test">
    clique pour afficher
 </button>

Je ne comprends pas ce qui va pas. Merci de votre aide.

Afficher la suite

A voir également:

2 réponses

Réponse 1 / 2

DoctorHow

Salut et en pur JS parce que je ne connait pas doc svelte ça donne quoi?

On peut très bien se passer de la variable bool puisqu'il suffit de tester la valeur de display.

function cache(id){
	if(document.getElementById(id).style.display=='none'){
		document.getElementById(id).style.display='block';
	}else{
document.getElementById(id).style.display=='none'
	}
}

Mieux aussi d'utiliser .addEventListener que sur l'attribut HTML onclick (ça me paraît bizarre quand même cette syntaxe on:click même avec un framework on a pas le droit de changer la syntaxe de HTML).

<button id=test>
    clique pour afficher
 </button>

Permet de rajouter au JavaScript

document.getElementById('test').addEventListener('click', cache('aCacher'), false)

Discussions similaires

Enlever le soulignement sous les liens en HTML/CSS

Espace en HTML

code Iframe YouTube ne fonctionne pas

Barre de recherche en html externe

menace détectée bloquée par Avast html:url-inf[sup]

afficher un tableau JS en HTML

Votre réponse

Discussions similaires