差分

ナビゲーションに移動 検索に移動

Knockout.js/visibleバインディング

384 バイト追加, 2012年4月20日 (金) 08:10
[[Knockout.js]]の'''visiblevisibleバインディング'''バインディングとは、DOM要素に結び付けられたモデルの値に応じて、DOM要素が表示または非表示になる。とは、パラメーターの値に応じ、関連付けられた[[DOM]]要素を表示または非表示にする[[Knockout.js/可視バインディング|可視バインディング]]のひとつである。
== パラメーター ==
値がfalse系(false、数字の「0」、null、undefined)の場合には、domElement=== false ===値がfalse系の場合 (false、数字の「0」、null、undefined)の場合には、domElement.style.displayにnoneに設定し、項目を非表示にする。
=== true ===
値がtrue系(true、非nullのオブジェクト、配列)の場合には、domElement.style.displayを削除し、項目を非表示にする。
=== ノート ===
[[JavaScript]]で動的に上書きするので、あらかじめ[[CSS]]で設定したスタイルよりも優先されるので注意すること。
非表示から表示になる際は「スタイル設定の削除」なので、たとえばdivのstyle.displayにinlineを設定していると、divのstyle.displayのデフォルト値であるblockになってしまう。
[[Knockout.js/observableobservable関数|observable関数]]でない値をバインディングした場合は、バインディング適用時([[Knockout.js/applyBindingsapplyBindings関数|applyBindings関数]]実行時)に1回だけ更新されて以降は更新されない。
== 使用例 ==
<script type="text/javascript">
jQuery(function() {
// モデルビューモデル
var AppViewModel = function() {
this.shouldShowMessage = ko.observable(true);
== 関連項目 ==
* [[Knockout.js]]** [[Knockout.js/可視バインディング|可視バインディング]]** [[Knockout.js/制御フローバインディング|制御フローバインディング]] 
== 参考文献 ==
<references/>
匿名利用者

案内メニュー