定义见:http://baike.baidu.com/item/Knockout/18611883#viewPageContent

此处仅列举一个小例子

<p>
<select data-bind="options: departmentList, optionsText: 'departmentName', optionsValue: 'departmentID',optionsCaption:'请选择'"></select>
</p>
<script type="text/javascript">
$(function(){
  var model= {
    departmentList:[{"departmentID": "1","departmentName": "信息技术部"},{"departmentID": "2","departmentName": "财务部"}]
  };
  ko.applyBindings(model);
});
</script>

  本例子意义在于将js的model对象在前台展示,此处model可以是js定义的,也可以是java返回的,只要格式满足上面就行。

  data-bind的几个属性:

    options----model的一个对象---------此处不可用引号将对象名括起来

    optionsText---要展示的内容的text键名

    optionsValue---要展示的内容的id键名

  applyBindings 用来激活Knockout。

Knockout 实例的更多相关文章

  1. 最近学习工作流 推荐一个activiti 的教程文档

    全文地址:http://www.mossle.com/docs/activiti/ Activiti 5.15 用户手册 Table of Contents 1. 简介 协议 下载 源码 必要的软件 ...

  2. Knockout官网实例在MVC下的实现-02,实现计次

    本篇使用Knockout在MVC下实现"Hello World",对应的官网实例在这里. 当次数达到3: View视图 页面包含三个部分:1.显示点击按钮的次数2.button按钮 ...

  3. Knockout官网实例在MVC下的实现-01,实现Hello world

    本篇使用Knockout在MVC下实现"Hello World",对应的官网实例在这里. View视图 Knockout的一个特点是:声明式绑定,即Declarative bind ...

  4. knockout 学习实例7 foreach

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  5. knockout 学习实例6 attr

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  6. knockout 学习实例5 style

    <!DOCTYPE html><html><head> <meta charset="utf-8"> <title>&l ...

  7. knockout 学习实例4 css

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  8. knockout 学习实例3 html

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  9. knockout 学习实例2 text

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. C#的SplitPanel如何设置上下和左右

    定位到Orientation属性即可

  2. 鼠标滚轮插件jQuery mousewheel

    delta的值是负的即-1,那么滚轮就是向下滚动.正的1就是向上. 插件方法: 1.为了监听滚轮事件,该插件引入了mousewheel事件.所以我们能够监听元素的mousewheel事件 2.该插件还 ...

  3. eclipse中j2ee(struts2)部署及相关问题释疑

    1.eclipse中进行web项目开发时.部署的时候和利用myeclipse部署时有非常大不同,由于在myeclipse的工具栏中有一个部署button.而且在myeclipse的preference ...

  4. Photoshop制作的ico图标方法

    photoshop是打不开ico的.只是能够通过安装插件实现. 插件点击这里能够下载. 用法,解压后的插件文件 粘贴到:  (英文版路径) /program files/adobe/photoshop ...

  5. [Python] How to unpack and pack collection in Python?

    It  is a pity that i can not add the video here. As a result, i offer the link as below: How to unpa ...

  6. AVD那些事儿

    启动了AVD却说找不到AVD 错误提示: No active compatible AVD's or devices found. Relaunch this configuration after ...

  7. IOS程序运行过程

    IOS程序是从main开始运行的,main.m文件内容如下: #import <UIKit/UIKit.h> #import "AppDelegate.h" int m ...

  8. bzoj 1646: [Usaco2007 Open]Catch That Cow 抓住那只牛【bfs】

    满脑子dp简直魔性 模拟题意bfs转移即可 #include<iostream> #include<cstdio> #include<queue> using na ...

  9. bzoj1015星球大战(并查集+离线)

    1015: [JSOI2008]星球大战starwar Time Limit: 3 Sec  Memory Limit: 162 MBSubmit: 5572  Solved: 2563 Descri ...

  10. LuoguP3398 仓鼠找sugar

    竞赛课想找一道水一点的tarjan题,看看这么久没做题手感有没有掉... 结果这题貌似不是tarjan啊...应该是LCA...假的标签!! 一遍过样例+一遍AC祭(好吧这么水的题也没啥好开心的) 大 ...