Changer la valeur d'un bouton au clic en JavaScript
Résolu
ktd.971
Messages postés
2
Statut
Membre
-
ktd.971 Messages postés 2 Statut Membre -
ktd.971 Messages postés 2 Statut Membre -
Hey tout le monde!
Nouveau dans le monde du web j'ai quelques difficultés avec js du coup je fais appel à vous.
J'ai besoin de changer la valeur d'un bouton après avoir cliqué dessus "voir plus" "voir moins" voilà
un résumé de mon code
Quelqu'un peut m'expliquer s'il vous plaît merciiiiiiiiiiiii !!!!
Nouveau dans le monde du web j'ai quelques difficultés avec js du coup je fais appel à vous.
J'ai besoin de changer la valeur d'un bouton après avoir cliqué dessus "voir plus" "voir moins" voilà
un résumé de mon code
<!DOCTYPE html>
<html>
<head>
<script>
document.addEventListener('DOMContentLoaded', function()
{
var button = document.getElementById('bouton');
var appears = document.querySelector('.test');
button.addEventListener('click', function(onClickButton)
{
appears.classList.toggle('hide');
if(appears=='hide')
{
button.innerHTML = "voir plus";
}
else
{
button.innerHTML = "voir moins";
}
});
});
</script>
<style>
.hide
{
display: none
}
</style>
<title>test2</title>
</head>
<body>
<div>
<img src="img1.png">
<img class="test hide" src="img2.png">
</div>
<button id="bouton"> voir plus</button>
</body>
</html>
Quelqu'un peut m'expliquer s'il vous plaît merciiiiiiiiiiiii !!!!
A voir également:
- Changer la valeur d'un bouton au clic en JavaScript
- Changer dns - Guide
- Changer clavier qwerty en azerty - Guide
- Changer carte graphique - Guide
- Changer extension fichier - Guide
- Changer wifi chromecast - Guide
1 réponse
C'EST GOOD
<!DOCTYPE html>
<html>
<head>
<script>
document.addEventListener('DOMContentLoaded', function()
{
var button = document.getElementById('bouton');
var appears = document.querySelector('.test');
var bool =1;
button.addEventListener('click', function(onClickButton)
{
appears.classList.toggle('hide');
if(bool=== 0)
{
button.innerHTML = "voir plus";
bool=1;
}
else
{
button.innerHTML = "voir moins";
bool = 0;
}
});
});
</script>
<style>
.hide
{
display: none
}
</style>
<title>test2</title>
</head>
<body>
<div>
<img src="img1.png">
<img class="test hide" src="img2.png">
</div>
<button id="bouton"> voir plus</button>
</body>
</html>