zoukankan      html  css  js  c++  java
  • Kendo MVVM 数据绑定(八) Style

    Kendo MVVM 数据绑定(八) Style

    Style 绑定可以通过 ViewModel 绑定到 DOM 元素 CSS 风格属性,例如:

    <span data-bind="style: {color: priceColor, fontWeight: priceFontWeight},text: price"></span>
    
    <script>
    var viewModel = kendo.observable({
        price: 42,
        priceColor: function() {
            var price = this.get("price");
    
            if (price <= 42) {
                return "#00ff00";
            } else {
                return "#ff0000";
            }
        },
        priceFontWeight: function() {
            var price = this.get("price");
    
            if (price <= 42) {
                return "bold";
            } else {
                return ""; //will reset the font weight to its default value
            }
        }
    });
    
    kendo.bind($("span"), viewModel);
    </script>

    这个例子显示:

    <span style="color: #00ff00; font-weight: bold">42</span>
    

    42

    要注意的是 CSS 属性的名称,如果 CSS 名称中含有连字符(-),比如 font-weight, font-size ,background-color 等,在使用时需要省略到连字符,使用 camel 风格的命名,如 fontWeight, fontSize,backgroundColor 等。

  • 相关阅读:
    小程序支付
    小程序传参
    git
    学习过程遇到问题的解决方法
    进程创建注意事项:函数及对应包
    进程创建:函数及对应包
    mac解决eclipse 端口占用问题
    暴力
    doc2vec
    Java正则表达式的解释说明
  • 原文地址:https://www.cnblogs.com/miaosj/p/10362334.html
Copyright © 2011-2022 走看看