「Knockout.js/attrバインディング」の版間の差分
imported>Administrator |
imported>Administrator |
||
| (同じ利用者による、間の3版が非表示) | |||
| 1行目: | 1行目: | ||
[[Knockout]]の'''attrバインディング'''とは、パラメーターの値に応じ、関連付けられた[[DOM]]要素のあらゆる属性を追加または削除する[[Knockout/可視バインディング|可視バインディング]]のひとつである。 | [[Knockout.js]]の'''attrバインディング'''とは、パラメーターの値に応じ、関連付けられた[[DOM]]要素のあらゆる属性を追加または削除する[[Knockout.js/可視バインディング|可視バインディング]]のひとつである。 | ||
たとえばimgタグのsrc属性とtitle属性を動的に変更したい場合にattrバインディングを使うと便利である。 | たとえばimgタグのsrc属性とtitle属性を動的に変更したい場合にattrバインディングを使うと便利である。 | ||
| 9行目: | 9行目: | ||
</source> | </source> | ||
attrバインディングはカンマ区切りで複数指定もできる。 | |||
<source lang="html5"> | <source lang="html5"> | ||
<div data-bind="attr: { 属性名: 値, 属性名: 値, ... }">...</div> | <div data-bind="attr: { 属性名: 値, 属性名: 値, ... }">...</div> | ||
| 43行目: | 43行目: | ||
<script type="text/javascript"> | <script type="text/javascript"> | ||
jQuery(function() { | jQuery(function() { | ||
// | // ビューモデル | ||
var AppViewModel = function() { | var AppViewModel = function() { | ||
this.url = ko.observable("http://knockoutjs.com/"); | this.url = ko.observable("http://knockoutjs.com/"); | ||
| 60行目: | 60行目: | ||
== 関連項目 == | == 関連項目 == | ||
* [[Knockout]] | * [[Knockout.js]] | ||
** [[Knockout/可視バインディング|可視バインディング]] | ** [[Knockout.js/可視バインディング|可視バインディング]] | ||
== 参考文献 == | == 参考文献 == | ||