Javascript MVVM模式前端框架—Knockout 2.1.0系列(10)：内建绑定之——Event绑定

前言&基础

有了上一节的基础，今天我们看一个相对比较好理解，也比较重要的binding:event事件绑定。它提供了内置事件绑定之外的给DOM元素添加事件处理函数的机制。

正文

Event Binding

绑定DOM元素的指定事件到指定的函数。

ko默认会将当前绑定的viewModel的上下文对象作为第1个参数传入处理函数。

ko会将Dom的event对象作为第2个参数传入

实例讲解：Event Binding

基本语法

Html代码

<div>
<div data-bind="event: { mouseover: enableDetails, mouseout: disableDetails }">
Mouse over me
</div>
<div data-bind="visible: detailsEnabled">
Details
</div>
</div>

Js代码

var viewModel = {
detailsEnabled: ko.observable(false),
enableDetails: function() {
this.detailsEnabled(true);
},
disableDetails: function() {
this.detailsEnabled(false);
}
};
ko.applyBindings(viewModel);

Demo1：演示Event Binding基本用法

http://jsfiddle.net/wbpmrck/PWVkx/1/embedded/

看不到内嵌Demo的点这里查看在线Demo

Demo2：演示获取DOM事件参数、自定义参数

http://jsfiddle.net/wbpmrck/PWVkx/2/embedded/

看不到内嵌Demo的点这里查看在线Demo

总结

今天主要介绍了ko中的Event Binding用法，其实ko里所有的事件绑定都可以用它来搞定，是不是很简单呢~。

感谢支持

精彩的还在后面，请大家多多支持，给点动力哈~

如果本文对您有帮助的话，请别吝啬手中的推荐票哦~