Ukryj / pokaż element z wartością logiczną

109

Mam ich dużo w swoim kodzie

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

Czy jest jakiś bardziej elegancki sposób w pakiecie z javascript, jquery lub podkreśleniem? Idealnie chciałbym coś, co wygląda tak

$element.showOrHideDependingOn(shouldElementBeVisible)

— Aakil Fernandes
źródło

jQuery show or hide

— George

@SpencerWieczorek że sprawa dzieje się odniesienia toggle, ale jest to inna kwestia

— Aakil Fernandes

166

Najwyraźniej możesz po prostu przekazać wartość logiczną do togglefunkcji

$element.toggle(shouldElementBeVisible)

— Aakil Fernandes
źródło

34

Zalecam używanie, $element.toggle(!!shouldElementBeVisible)aby zapobiec przypadkowemu uderzeniu jednego z innych „przeciążeń” , chyba że oczywiście masz pewność, że zmienna jest wartością logiczną.

— Jeroen

8

Mogłaby być lepsza opcja $element.toggle(shouldElementBeVisible == true).

— jox,

"0"i "false"są traktowane zupełnie inaczej niż w falsekażdym razie, więc nie sądzę, że to rozróżnienie naprawdę ma znaczenie - nawet 0byłoby niepoprawne, gdybyś chciał, aby było ukryte, ponieważ wszystkie te czasy animacji są ustawione, ale nadal mają odwróconą widoczność.

— Tasgall

19

Tak jest!

$element.toggle();

Bez żadnych parametrów togglepo prostu przełącza widoczność elementów (nie mam na myśli visibilitywłaściwości) i zależy od aktualnego stanu elementu.

$element.toggle(display);

Jeśli wywołujesz togglez parametrem boolowskim, element jest wyświetlany, jeśli tak jest truei hiddenjeśli jestfalse

źródło

— Zach Spencer
źródło

2

Już miałem to oznaczyć źle, ale zdałem sobie sprawę, że ostatnia referencja API pozwala ustawić obiekt logiczny zamiast obiektu opcji.

— Aakil Fernandes

kilka linijek poniżej: „Bez parametrów metoda .toggle () po prostu przełącza widoczność elementów”

— Zach Spencer,

2

to właściwie przeciwieństwo tego, czego chciałem. Chciałem, aby aktualny stan elementu był nieistotny. Stan powinien być oparty na zmiennej boolowskiej.

— Aakil Fernandes

@AakilFernandes Więc zmienna isShownnie ma znaczenia dla $elementbycia widocznym czy nie? Ale osobna zmienna niezwiązana z elementem?

— Spencer Wieczorek

Tak, przepraszam, prawdopodobnie powinienem zmienić nazwę isShownna coś w rodzaju, shouldElementBeVisibleaby było to bardziej oczywiste

— Aakil Fernandes

2

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

$element.toggle();

Spowoduje to wyświetlenie elementu, jeśli jest ukryty, i ukrycie go, jeśli jest pokazany.

— Mikrofon
źródło

0

Funkcja .toggle()zmienia displayelement.

Jeśli chcesz to zmienić visibility, sugerowałbym użycie ?:operatora. W tym celu w swoim CSS ustaw widoczność na pierwotny stan, aw JS po prostu umieść:

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

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

— Mel
źródło