web-dev-qa-db-ja.com

ブール値で要素を非表示/表示

私はコードにこれらの多くを持っている傾向があります

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

Javascript、jquery、またはアンダースコアでパッケージ化されたよりエレガントな方法はありますか？理想的にはこのようなものが欲しい

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

toggle関数にブール値を渡すことができるようです

$element.toggle(shouldElementBeVisible)
156
Aakil Fernandes

はいあります！

$element.toggle();

パラメータなしのtoggleは、要素の可視性を切り替えるだけで（visibilityプロパティを意味するわけではありません）、要素の現在の状態に依存します。

$element.toggle(display);

ブールパラメータを使用してtoggleを呼び出すと、trueの場合は要素が表示され、hiddenの場合はfalseが表示されます。

ソース

13
Zach Spencer

jQueryにはtoggleがあります： http://api.jquery.com/toggle/

$element.toggle();

これにより、要素が非表示の場合は表示され、表示されている場合は非表示になります。

2
Mike

関数.toggle()は、要素のdisplayを変更します。

代わりにvisibilityを変更する場合は、?:演算子を使用することをお勧めします。このために、CSSで、可視性を元の状態に設定し、JSに次のように入力します。

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

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