Maison  >  Article  >  interface Web  >  Comment activer/désactiver la visibilité d'un élément DIV avec un bouton en utilisant JavaScript ou jQuery ?

Comment activer/désactiver la visibilité d'un élément DIV avec un bouton en utilisant JavaScript ou jQuery ?

Barbara Streisand
Barbara Streisandoriginal
2024-10-31 10:44:29834parcourir

How do I toggle the visibility of a DIV element with a button using JavaScript or jQuery?

Basculer la visibilité d'un DIV avec un bouton

Vous avez un élément DIV avec un ID "newpost" dont vous souhaitez activer/désactiver la visibilité à l'aide d'un bouton.

Pour y parvenir, envisagez les approches suivantes :

JavaScript pur :

Implémentez une fonction JavaScript pour basculer la visibilité du DIV :

<code class="javascript">var button = document.getElementById('button'); // Assumes element with id='button'

button.onclick = function() {
    var div = document.getElementById('newpost');
    if (div.style.display !== 'none') {
        div.style.display = 'none';
    }
    else {
        div.style.display = 'block';
    }
};</code>

jQuery :

jQuery propose une solution concise en utilisant la méthode toggle() :

<code class="javascript">$("#button").click(function() { 
    // assumes element with id='button'
    $("#newpost").toggle();
});</code>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn