您的位置：首页 > 产品设计 > UI/UE

Kendo UI开发教程(19): Kendo MVVM 数据绑定(八) Style

2013-09-08 16:52 513 查看
Style绑定可以通过ViewModel绑定到DOM元素CSS风格属性，例如：
1
<
span
data-bind="style: {color: priceColor, fontWeight: priceFontWeight},
2
text: price"></
span
>
3
4
<
script
>
5
var viewModel = kendo.observable({
6
price: 42,
7
priceColor: function() {
8
var price = this.get("price");
9
10
if (price <= 42) {
11
return "#00ff00";
12
} else {
13
return "#ff0000";
14
}
15
},
16
priceFontWeight: function() {
17
var price = this.get("price");
18
19
if (price <= 42) {
20
return "bold";
21
} else {
22
return ""; //will reset the font weight to its default value
23
}
24
}
25
});
26
27
kendo.bind($("span"), viewModel);
28
</
script
>
这个例子显示：
1
<
span
 
style
=
"color: #00ff00; font-weight: bold"
>42</
span
>
42要注意的是CSS属性的名称，如果CSS名称中含有连字符（-），比如font-weight, font-size ,background-color等，在使用时需要省略到连字符，使用camel风格的命名，如fontWeight, fontSize,backgroundColor等。
                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航