Knockout应用开发指南（完整版） 目录索引
http://learn.knockoutjs.com/ 所有示例和代码都在在上面直接运行预览
注意：因为它用了google的cdn加速，所要要用代_理+_翻_墙才能正常加载
使用Knockout有一段时间了（确切的说从MIX11大会宣传该JavaScript类库以来，我们就在使用，目前已经在正式的asp.net MVC项目中使用），Knockout使用js代码达到双向绑定的目的，类似Silverlight/WPF里的绑定一样，我们主要就是利用相关的特性进行开发的，极大地减少了代码开发量。
关于该系列文章：
本系列文章共份10个章节（13篇），主要是翻译官方站点教程文章，然后加了一些自己的理解。有任何技术点不明白或者需要讨论的，欢迎大家留言拍砖。
目录：
Knockout应用开发指南 第二章：监控属性(Observables)
Knockout应用开发指南 第六章：加载或保存JSON数据
更多例子：
用Javascript评估用户输入密码的强度（Knockout版）
介绍：
Knockout是一个轻量级的UI类库，通过应用MVVM模式使JavaScript前端UI简单化。如果你还不了解Knockout是啥，先请看一下微软MIX11大会上的一段视频
连接地址：http://channel9.msdn.com/Events/MIX/MIX11/FRM08
或者直接运行下面的代码看看效果：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script type="text/javascript" src="http://knockoutjs.com/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="http://knockoutjs.com/js/jquery.tmpl.js"></script>
<script type="text/javascript" src="http://knockoutjs.com/js/knockout-1.2.1.js"></script>
</head>
<body>
Choose a ticket class:
<select data-bind="options: tickets,
optionsCaption: 'Choose...',
optionsText: 'name',
value: chosenTicket">
</select>
</p>
<p data-bind="template: 'ticketTemplate'">
</p>
<script id="ticketTemplate" type="text/x-jquery-tmpl">
{{if chosenTicket}}
You have chosen <b>${ chosenTicket().name }</b>
($${ chosenTicket().price })
<button data-bind="click: resetTicket">Clear</button>
{{/if}}
</script>
<script type="text/javascript">
var viewModel = {
tickets: [
{ name: "Economy", price: 199.95 },
{ name: "Business", price: 449.22 },
{ name: "First Class", price: 1199.99 }
],
chosenTicket: ko.observable(),
resetTicket: function () { this.chosenTicket(null) }
};
ko.applyBindings(viewModel);
</script>
</body>
</html>
插件：
Knockout也有丰富的插件可以使用，例如：
你可以使用集成JQueryUI功能的插件来实现autoComplete功能：
<input type="text" data-bind="autocomplete : autocompleteConfig"/>
而没必要每次都要声明下面这样的代码：
$( "#inputId" ).autocomplete({
source: availableTags
});
或者如果你想用表单验证功能，你可以使用验证插件:
var myObj = ko.observable('').extend({ max: 99 });
或者
<input type="text" data-bind="value: myProp" max="99"/>
而不是每次在点击提交按钮的时候或者离开焦点的时候都去检查。
结论：
使用Knockout将极大减少JavaScript的开发量，是需要使用简单的绑定语法就可以很快速地应用到你的站点上。
赶紧开始你的快速学习征程吧！
Knockout应用开发指南（完整版） 目录索引的更多相关文章
- Knockout中文开发指南(完整版API中文文档) 目录索引
a, .tree li > span { padding: 4pt; border-radius: 4px; } .tree li a { color:#46cfb0; text-decorat ...
- Knockout应用开发指南（完整版） 目录索引（转）
使用Knockout有一段时间了(确切的说从MIX11大会宣传该JavaScript类库以来,我们就在使用,目前已经在正式的asp.net MVC项目中使用),Knockout使用js代码达到双向绑定 ...
- Knockout应用开发指南
Knockout应用开发指南 第一章:入门 2011-11-21 14:20 by 汤姆大叔, 20799 阅读, 17 评论, 收藏, 编辑 1 Knockout简介 (Introductio ...
- Knockout应用开发指南 第八章：简单应用举例（2）
原文:Knockout应用开发指南 第八章:简单应用举例(2) 5 Control types 这个例子,对view model没有什么特殊的展示,只是展示如何绑定到各种元素上(例如,select ...
- Knockout应用开发指南 第四章：模板绑定
原文:Knockout应用开发指南 第四章:模板绑定 模板绑定The template binding 目的 template绑定通过模板将数据render到页面.模板绑定对于构建嵌套结构的页面非常方 ...
- Knockout应用开发指南 第三章：绑定语法（3）
原文:Knockout应用开发指南 第三章:绑定语法(3) 12 value 绑定 目的 value绑定是关联DOM元素的值到view model的属性上.主要是用在表单控件<input&g ...
- Knockout应用开发指南 第三章：绑定语法（2）
原文:Knockout应用开发指南 第三章:绑定语法(2) 7 click 绑定 目的 click绑定在DOM元素上添加事件句柄以便元素被点击的时候执行定义的JavaScript 函数.大部分是用 ...
- Knockout应用开发指南 第二章：监控属性(Observables)
原文:Knockout应用开发指南 第二章:监控属性(Observables) 关于Knockout的3个重要概念(Observables,DependentObservables,Observabl ...
- Hadoop权威指南(中文版-带目录索引)pdf电子书
Hadoop权威指南(中文版-带目录索引)pdf电子书下载地址:百度网盘点击下载:链接:https://pan.baidu.com/s/1E-8eLaaqTCkKESNPDqq0jw 提取码:g6 ...
随机推荐
- HDU5438--Ponds (拓排+BFS)
点击打开链接 题意:给定n个池塘,m对池塘相连,现在要将与少于2个池塘相连的池塘拆除,形成森林,求节点数为奇数的树权值之和 思路:按照拓排的思想不断删除度数小于2的节点 #include<bit ...
- Unity3D ShaderLab立方体图的法线渲染
Unity3D ShaderLab立方体图的法线渲染 某些情况下,我们希望立方体图的材质球上产生法线效果,来更多的表现细节,比如菱形花纹的玻璃,冰块的表面. 在帧数的协调下,我们可以通过input结构 ...
- WPF文本框密码框添加水印效果
WPF文本框密码框添加水印效果 来源: 阅读:559 时间:2014-12-31 分享: 0 按照惯例,先看下效果 文本框水印 文本框水印相对简单,不需要重写模板,仅仅需要一个VisualBrush ...
- MVC 构造新Model实现内容搜索
当前在使用MVC开发一个网站,习惯了使用ASP.NET中控件,转到MVC之后突然对于页面和后台代码的传值感觉无从下手.花了点时间在网上看了写帖子后,想到了一个方法,重新构造一个新Model, 然后利用 ...
- Smart210---学习记录 竞态与并发
竞态与并发 自旋锁 若一个进程要访问临界资源,测试锁空闲,则进程获得这个锁并继续执行:若测试结果表明锁扔被 占用,进程将在一个小的循环内重复“测试并设置”操作,进行所谓的“自旋”,等待自旋锁持有者释 ...
- Ecshop安装过程中的的问题：cls_image::gd_version()和不支持JPEG
在安装Ecshop的时候,遇到两个问题: 1.Strict Standards: Non-static method cls_image::gd_version() should not be cal ...
- STL容器用法速查表：list,vector,stack,queue,deque,priority_queue,set,map
list vector deque stack queue priority_queue set [unordered_set] map [unordered_map] multimap [uno ...
- ARM异常中断处理
ARM异常中断处理 在ARM体系中,通常有以下3种方式控制程序的执行流程: 在正常程序执行过程中,每执行一条ARM指令,程序计数器寄存器(PC)的值加4个字节:每执行一条Thumb指令,程序计数器寄存 ...
- 阿里云Centos中二级域名绑定二级目录的方法
对于一些目录,我们往往需要对其指定二级域名,那么具体如何操作呢?下面,我将用亲身实践来说明一下. 由于第一次接触centos,我不得不借助于网络资源.然后得知要开启mod_rewrite这个模块,具体 ...
- 使用Jmeter测试MySQL性能——(1)连接配置
在搭建MySQL集群之后需要测试集群的性能究竟如何,采用Apache的测试工具Jmeter进行测试,本文主要介绍主要实现Jmeter配置连接到MySQL. 安装相应的软件 首先Jmeter是基于Jav ...