Knockout 事件传递参数的方法

标签：javascript   knockout   事件   多参数   

        在Knockout中直接使用函数传递参数是不行的，会导致函数在初始化时就被调用，例如：

<span style="font-size:14px;"><div data-bind="click:changeEditor($index)"></div>
</span>

        要实现参数的传递，有2种方法：

1、方法一：使用函数包裹

<div data-bind="event: { click: function(data, event) {changeEditor('param1', 'param2', data, event) } }">
    Mouse over me
</div>

点击事件响应函数又套了一层，调用chageEditor函数，在原changeEditor()函数调用中传入参数。

2、方法二：使用bind函数

<button data-bind="event: { click: changeEditor.bind($data, 'param1', 'param2') }">
    Click me
</button>

使用该方式传递参数时，$data为形式化写法，不能改变，后面可带若干参数，如param1，param2等。

3、确省的参数传递

<div data-bind="event: { mouseover: myFunction }">
    Mouse over me
</div>
 
 <script type="text/javascript">
    var viewModel = {
        myFunction: function(data, event) {
            if (event.shiftKey) {
                //do something different when user has shift key down
            } else {
                //do normal action
            }
        }
    };
    ko.applyBindings(viewModel);
</script>

注意：在bind方式传递参数时，data和event两个参数依然被缺省传递，新加入的参数，在使用时排在第一位，例如，进行下面的定义：

<span style="font-size:14px;"><div data-bind="click:changeEditor.bind($data,$index)"></div></span>

function changeEditor(index,data, event){
	alert('参数:'+ index + ',' + data+ "," + event);
	alert(arguments.length);

	 var tmp = data;
	 tmp.headerText = 'OK!!!';
	 tmp.editing = true;
	// columns2[idx](tmp);
}

Knockout 事件传递参数的方法

标签：javascript   knockout   事件   多参数   

原文地址：http://blog.csdn.net/hongweigg/article/details/44020877