前言 如果你要探测和响应一个对象的变化,你应该用observables. 如果你需要探测和响应一个集合对象的变化,你应该用observableArray . 在很多场景下,它都非常有用,比如你要在UI上需要显示/编辑的一个列表数据集合,然后对集合进行添加和删除. 使用observables数组 1.简单举例 <script type="text/javascript"> var myObservableArray = ko.observableArray(); ///初始化…

1.Knockout.Js官网学习(简介) 2.Knockout.Js官网学习(监控属性Observables) Knockout.Js官网学习(数组observable) 3.Knockout.Js官网学习(visible绑定) Knockout.Js官网学习(text绑定) Knockout.Js官网学习(html绑定.css绑定) Knockout.Js官网学习(style绑定.attr绑定) 4.Knockout.Js官网学习(click绑定) Knockout.Js官网学习(event…

前言 最近一段时间在网上经常看到关于Knockout.js文章,于是自己就到官网看了下,不过是英文的,自己果断搞不来,借用google翻译了一下.然后刚刚发现在建立asp.net mvc4.0的应用程序的时候,建完之后我直接在项目的Scripts中看到了这两个js类库,用谷歌翻译看了下官网,Ko的实现原理是MVVM,比MVC高级一些. 简介MVVM模式 MVVM是Model-View-ViewModel的简写. WPF的数据绑定与Presentation Model相结合是非常好的做法,使得开发…

前言 Knockout可以实现很复杂的客户端交互,但是几乎所有的web应用程序都要和服务器端交换数据(至少为了本地存储需要序列化数据),交换数据最方便的就是使用JSON格式 – 大多数的Ajax应用程序也是使用这种格式. 加载或保存数据 Knockout不限制你用任何技术加载和保存数据.你可以使用任何技术和服务器来交互.用的最多的是使用jQuery的Ajax帮助,例如:getJSON,post和ajax.你可以通过这些方法从服务器端获取数据: $.getJSON("/some/url"…

模板绑定器 如今页面结构越来越复杂,仅仅依靠foreach已经不足以我们的使用,这个时候我们就需要模板的存在,模板的优点自然很多,首先会让页面整洁,同时修改起来也可以方面的定位,最重要的是ko可以条件式选择模板来呈现数据.下面我们将开始逐一的学习. 1.呈现一个简单的模板 常规的js我们需要写上去,如下所示: 1 <script type="text/javascript"> 2 $(function () { 3 var viewMode = { 4 datas: ko.…

前言 value绑定是关联DOM元素的值到view model的属性上.主要是用在表单控件<input>,<select>和<textarea>上. 当用户编辑表单控件的时候, view model对应的属性值会自动更新.同样,当你更新view model属性的时候,相对应的元素值在页面上也会自动更新. 注:如果你在checkbox或者radio button上使用checked绑定来读取或者写入元素的 checked状态,而不是value 值的绑定. 简单示例 代码如…

前言 text 绑定到DOM元素上,使得该元素显示的文本值为你绑定的参数.该绑定在显示<span>或者<em>上非常有用,但是你可以用在任何元素上. 简单绑定 Today's message is: <span data-bind="text: myMessage"></span> <script type="text/javascript" src="~/Scripts/knockout-2.3.0.…

selectedOptions绑定 selectedOptions绑定用于控制multi-select列表已经被选择的元素,用在使用options绑定的<select>元素上. 当用户在multi-select列表选择或反选一个项的时候,会将view model的数组进行相应的添加或者删除.同样,如果view model上的这个数组是observable数组的话,你添加或者删除任何item(通过push或者splice)的时候,相应的UI界面里的option项也会被选择上或者反选.这种方式是2…

前言 Knockout设计成允许你使用任何JavaScript对象作为view model.必须view model的一些属性是observable的,你可以使用KO绑定他们到你的UI元素上,当这些observable值改变的时候,这些UI元素就会自动更新. 使用mapping要引用的Js文件https://github.com/SteveSanderson/knockout.mapping/tree/master/build/output. 手工mapping 显示当前服务器时间和你网站上的当…

event绑定 event绑定在DOM元素上添加指定的事件句柄以便元素被触发的时候执行定义的JavaScript 函数.大部分情况下是用在keypress,mouseover和mouseout上. 简单示例 <div> <div data-bind="event: { mouseover: enableDetails, mouseout: disableDetails }"> Mouse over me </div> <div data-bin…