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 等。
Kendo MVVM 数据绑定(八) Style的更多相关文章
- Kendo MVVM 数据绑定(一) attr
Kendo MVVM 数据绑定(一) attr Kendo UI MVVM 数据绑定支持的绑定属性有 attr, checked, click, custom , disabled,enabled, ...
- Kendo UI开发教程(16): Kendo MVVM 数据绑定(五) Events
本篇和Kendo UI开发教程(14): Kendo MVVM 数据绑定(三) Click类似,为事件绑定的一般形式.Events绑定支持将ViewModel的方法绑定到DOM元素的事件处理(如鼠标事 ...
- Kendo MVVM 数据绑定(十一) Value
Kendo MVVM 数据绑定(十一) Value Value 绑定可以把 ViewModel 的某个属性绑定到 DOM 元素或某个 UI 组件的 Value 属性.当用户修改 DOM 元素或 UI ...
- Kendo MVVM 数据绑定(十) Source
Kendo MVVM 数据绑定(十) Source Source 绑定可以把 ViewModel 的值和由 Kendo 模板定义的目标元素绑定,如果 ViewModel 的值发生变化,被绑定的目标元素 ...
- Kendo MVVM 数据绑定(九) Text
Kendo MVVM 数据绑定(九) Text Text 绑定可以使用 ViewModel 来设置 DOM 元素的文本属性,如果需要设置 input,textarea,或 select 的显示,需要使 ...
- Kendo MVVM 数据绑定(七) Invisible/Visible
Kendo MVVM 数据绑定(七) Invisible/Visible Invisible/Visible 绑定可以根据 ViewModel 的某个属性来显示/隐藏 DOM 元素.例如: <d ...
- Kendo MVVM 数据绑定(六) Html
Kendo MVVM 数据绑定(六) Html Html 绑定可以使用 ViewMod e 的属性来设置 DOM 元素的 innerHTML 属性.如果 ViewModel 的属性的数据类型不是字符串 ...
- Kendo MVVM 数据绑定(五) Events
Kendo MVVM 数据绑定(五) Events 本篇和 Kendo MVVM 数据绑定(三) Click 类似,为事件绑定的一般形式.Events 绑定支持将 ViewModel 的方法绑定到 D ...
- Kendo MVVM 数据绑定(四) Disabled/Enabled
Kendo MVVM 数据绑定(四) Disabled/Enabled Disabled 和 Enabled 绑定可以根据 ViewModel 的某个属性值的 true,false 来设置 DOM 元 ...
随机推荐
- bzoj 3796 Mushroom追妹纸 —— 后缀数组
题目:https://www.lydsy.com/JudgeOnline/problem.php?id=3796 先把三个串拼在一起,KMP 求 s1 , s2 中每个位置和 s3 的匹配情况: 注意 ...
- 微信开放平台搭建之EasyWeChat
背景 公司有一个产品,需要用到微信授权登录及微信消息推送等功能.本来能够简单的使用公众号的接口将appid和appsecrect等信息写到配置文件里,但是作为一个产品化的东西,从体验等各方面来讲都不能 ...
- Oracle中的float类型字段
Oracle中的float类型对应着C#中的decimal类型
- HTML特殊字符的html、js、css写法汇总 (转)
⇠ 箭头类 符号 UNICODE 符号 UNICODE HTML JS CSS HTML JS CSS ⇠ ⇠ \u21E0 \21E0 ⇢ ⇢ \u21E2 \ ...
- JavaScript高级程序设计学习笔记第三章--基本概念
一.标识符: 1.区分大小写 2.命名规则: 第一个字符必须是一个字母.下划线(_)或一个美元符号($) 其他字符可以是字母.下划线.美元符号或数字 标识符中的字母也可以包含扩展的 ASCII 或 U ...
- 转:isualvm远程监控Tomcat
一.Java VisualVM 概述 对于使用命令行远程监控jvm 太麻烦 . 在jdk1.6 中 Oracle 提供了一个新的可视化的. JVM 监控工具 Java VisualVM .jvisua ...
- vb常用命名空间
摘自:http://www.2cto.com/kf/201211/170837.html 感谢 (一)如下是系统中分离出来Imports MicrosoftImports Microsoft.CSha ...
- HDU - 3899 JLUCPC(树形dp求距离和)
JLUCPC Dr. Skywind and Dr. Walkoncloud are planning to hold the annual JLU Collegiate Programming Co ...
- 一、初识mybatis
orm框架 1.配置文件(配置别名.mapper xml文件.数据库连接.事务) 2.创建SqlSessionFactory,创建SqlSession 3.创建model,创建Mapper xml文件 ...
- 简单的GTK窗体搭建
#include<gtk/gtk.h> //必须引用gtk/gtk.h这个头文件 2 int main(int argc,char *argv[]) //标准c语言主函数的声明 3 { 4 ...