web-dev-qa-db-fra.com

Masquer / afficher un élément avec un booléen

J'ai tendance à en avoir beaucoup dans mon code

if(shouldElementBeVisible)
    $element.show()
else
    $element.hide()

Existe-t-il une méthode plus élégante contenant javascript, jquery ou underscore? Idéalement, je veux quelque chose qui ressemble à ceci

$element.showOrHideDependingOn(shouldElementBeVisible)
javascriptjqueryunderscore.jsvisibility
99
Aakil Fernandes

Apparemment, vous pouvez simplement passer un booléen à la fonction toggle

$element.toggle(shouldElementBeVisible)
156
Aakil Fernandes

Oui il y a!

$element.toggle();

Sans aucun paramètre, toggle ne fait que basculer la visibilité des éléments (je ne parle pas de la propriété visibility) et dépend de l'état actuel de l'élément.

$element.toggle(display);

Si vous appelez toggle avec un paramètre booléen, l'élément est affiché s'il s'agit de true et hidden s'il s'agit de false.

source

13
Zach Spencer

jQuery a toggle: http://api.jquery.com/toggle/

$element.toggle();

Cela montrera l'élément s'il est caché et le cachera s'il est montré.

2
Mike

La fonction .toggle() change le display de l'élément.

Si vous voulez changer visibility, je vous suggérerais plutôt d'utiliser le ?: _ opérateur. Pour cela, dans votre CSS, définissez la visibilité sur son état d'origine, et dans le JS simplement:

    var checkboxChecked = $("#yourCheckbox").(":checked");

    $("#yourElement").css("visibility", checkboxChecked ? "visible" : "hidden");
0
Mel