KnockoutJS 3.X API 第四章之click绑定

当我们在开发网页应用的时候，常常需要在页面上给用户提供可以点击的交互元素，例如按钮、超链接等等。KnockoutJS提供了click绑定，方便我们在页面上绑定点击事件。

click绑定的语法

click绑定的语法很简单，只需要在HTML标签中添加一个data-bind属性，属性的值为"click: 回调函数名"即可。 回调函数可以在ViewModel或者其它JavaScript代码中定义。

<button data-bind="click: myFunction">点击我</button>

简单的点击事件

以下我们来看一个简单的示例，点击按钮后会在控制台中输出一个信息。

<button data-bind="click: function () { console.log('按钮被点击了！'); }">点击我</button>

点击按钮后，将会在控制台中输出"按钮被点击了！"的信息。

click绑定和事件参数

click绑定还可以接受事件参数。例如，在以下示例中我们给按钮传递了参数name，当点击按钮时，name的值将会被显示在页面上。

<button data-bind="click: function (data, event) { alert('您点击了' + data.name); }">点击我</button>

需要注意的是，在绑定click事件时，回调函数的第一个参数一定是$root，它表示整个ViewModel，第二个参数则为事件对象event。

以上就是click绑定的基本用法和语法。在实际应用中，我们可以利用click绑定为页面上的元素绑定各种点击事件，从而实现更多的交互效果。