Kendo UI开发教程(16): Kendo MVVM 数据绑定(五) Events
本篇和Kendo UI开发教程(14): Kendo MVVM 数据绑定(三) Click类似，为事件绑定的一般形式。
Events绑定支持将ViewModel的方法绑定到DOM元素的事件处理（如鼠标事件）。
例如：
1<div id="view">2 <span data-bind="events: { mouseover: showDescription, mouseout: hideDescription }">Show description</span>3 <span data-bind="visible: isDescriptionShown, text: description"></span>4</div>5<script>6 var viewModel = kendo.observable({7 description: "Description",8 isDescriptionShown: false,9 showDescription: function (e) {10 // show the span by setting isDescriptionShown to true11 this.set("isDescriptionShown", true);12 },13 hideDescription: function (e) {14 // hide the span by setting isDescriptionShown to false15 this.set("isDescriptionShown", false);16 }17 });18 19 kendo.bind($("#view"), viewModel);20</script>
实际上，click绑定是events绑定的一个特例，下面的两种实现是等效的：
1<span data-bind="click: clickHandler"></span>2 3<span data-bind="events: { click: clickHandler }"></span>注： Kendo MVVM的 DOM 事件参数 e封装在jQuery 的Event对象中。
如果需要终止事件向上传递(event bubbling)，可以调用stopPropagation方法。
1<span data-bind="click: click">Click</span>2<script>3var viewModel = kendo.observable({4 click: function(e) {5 e.stopPropagation();6 }7});8 9kendo.bind($("span"), viewModel);10</script>如果要取消某些DOM元素单击后的缺省处理函数，比如转到其它页面或是提交表单，为了取消这些缺省实际处理，可以调用preventDefault()方法。例如：
1<a href="http://example.com" data-bind="click: click">Click</span>2<script>3var viewModel = kendo.observable({4 click: function(e) {5 // stop the browser from navigating to http://example.com6 e.preventDefault();7 }8});9 10kendo.bind($("a"), viewModel);11</script>