<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

    <script src="js/jquery-1.11.1.min.js"></script>

    <script src="js/knockout-3.3.0.js"></script>

    <style>

        .b_b

        {

            background-color: blue;

        }

    </style>

    <script type="text/javascript">

        var viewModel = {

            currentProfit: ko.observable(1) // Positive value, so initially we don't apply the "bb" class

        };

        $(function () {

            viewModel.currentProfit(-1); // Causes the "bb" class to be applied

            ko.applyBindings(viewModel);

        })

    </script>

</head>

<body>

    <div data-bind="css: { 'b_b': currentProfit() < 0 }">

        Profit Information

    </div>

</body>

Knockout.js CSS绑定的更多相关文章

  1. Knockout: 使用CSS绑定和event的blur失去焦点事件, 给未通过校验的输入框添加红色边框突出显示.

    目的:使用knockout提供的机制实现输入框失去焦点后的校验工作,并使用CSS绑定给未通过校验的输入框添加红色边框突出显示. 步骤: 先在htm中添加.error的css样式, 并在输入框中的dat ...

  2. Knockout: 实践CSS绑定和jQuery的blur失去焦点事件, 给未通过校验的输入框添加红色边框突出显示.

    目的: 实践一下Knockout提供的CSS绑定功能和JQuery的blur失去焦点事件, 这次不使用Knockout的afterkeydown事件了． 步骤: 先在htm中添加.error的css样 ...

  3. Knockout: 实践CSS绑定和afterkeydown事件, 给未通过校验的输入框添加红色边框突出显示; 使用afterkeydown事件自动将输入转大写字母.

    目的: 实践一下Knockout提供的CSS绑定功能和afterkeydown事件． 步骤: 先在htm中添加.error的css样式, 并在输入框中绑定css: { error: !firstNam ...

  4. knockout.js模板绑定之利用Underscore.js模板引擎示例

    View代码 <h1>People</h1> <ul data-bind="template: { name: 'peopleList' }"> ...

  5. Knockout.js Attr绑定

    <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&quo ...

  6. Knockout.js Style绑定

    <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&quo ...

  7. Knockout.js Text绑定

    <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&quo ...

  8. Knockout.js Visible绑定

    <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&quo ...

  9. Knockout.Js官网学习（html绑定、css绑定）

    Html绑定 html绑定到DOM元素上,使得该元素显示的HTML值为你绑定的参数.如果在你的view model里声明HTML标记并且render的话,那非常有用. 简单示例 <div dat ...

随机推荐

  1. TestNG参数化之@Parameters传参

    通过TestNG实现参数话常用两种方式,一种是借助 @Parameters读取testng.xml中参数,一种是使用@DataProvider注解传参. 此次主要讲解XML传参,语法:在java类中定 ...

  2. “全栈2019”Java第八十七章：类中嵌套接口的应用场景（拔高题）

    难度 初级 学习时间 10分钟 适合人群 零基础 开发语言 Java 开发环境 JDK v11 IntelliJ IDEA v2018.3 文章原文链接 "全栈2019"Java第 ...

  3. 【bzoj 2716】[Violet 3]天使玩偶 （CDQ+树状数组）

    题目描述 Ayu 在七年前曾经收到过一个天使玩偶,当时她把它当作时间囊埋在了地下.而七年后 的今天,Ayu 却忘了她把天使玩偶埋在了哪里,所以她决定仅凭一点模糊的记忆来寻找它. 我们把 Ayu 生活的 ...

  4. 【FAQ】tomcat启动jdk版本不一致

    一.tomcat7.exe与startup.bat的区别: 1.这两个都可以启动tomcat,但tomcat7.exe必须安装了服务才能启动,而startup.bat不需要 2.另外一个区别是它们启动 ...

  5. graphviz画图与中文乱码等问题总结

    最近想写一些文档,画一些程序的逻辑图,用了vision,markdown等软件感觉不怎么好用,于是找到graphviz,这款强大的软件.下面介绍一些入门,还有自己在用的过程中遇到的问题 1.中文乱码的 ...

  6. Hadoop完全分布式搭建

    ---记于2015年11月6日星期五 准备工作 软硬件环境 主机操作系统:处理器:i5,主频:3.2G,内存:8G,Windows64 虚拟机软件:VMware Workstation 10 虚拟操作 ...

  7. 使用HttpClient出现java.io.IOException: Attempted read from closed stream

    问题描述: 使用httpClient时候,出现java.io.IOException: Attempted read from closed stream. 原始代码: public static S ...

  8. leetcode-849-到最近的人的最大距离

    题目描述: 在一排座位( seats)中,1 代表有人坐在座位上,0 代表座位上是空的. 至少有一个空座位,且至少有一人坐在座位上. 亚历克斯希望坐在一个能够使他与离他最近的人之间的距离达到最大化的座 ...

  9. leetcode-482-License Key Formatting

    题目描述: You are given a license key represented as a string S which consists only alphanumeric charact ...

  10. SDN定义网络

    http://edu.51cto.com/course/course_id-4466.html http://edu.51cto.com/course/course_id-4497.html