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

要实现参数的传递,有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>

即使绑定定义中函数不带任何参数,data和event两个参数总会被缺省传递,data指当前的viewModel对象,event为事件对象。

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

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

在使用时,index 为第一个参数。

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 事件传递参数的方法的更多相关文章

  1. [ActionScript 3.0] AS3.0 给flash事件传递参数的方法

    有时我们想要给flash内置的事件(比如MouseEvent)传递参数,这时我们可以用到下面的方法. import flash.events.MouseEvent; mc.addEventListen ...

  2. react.js 点击事件传递参数的方法

    <button onClick={this.handleClick.bind(this, props0, props1, ...}></button> handleClick( ...

  3. Extjs中给同一个GridPanel中的事件添加参数的方法

    Extjs中给同一个GridPanel中的事件添加参数的方法: this.isUse = new Ext.Action({            text:'启用',            scope ...

  4. C++向main函数传递参数的方法(实例已上传至github)

    通常情况下,我们定义的main函数都只有空形参列表: int main(){...} 然而,有时我们确实需要给mian传递实参,一种常见的情况是用户设置一组选项来确定函数所要执行的操作.例如,假定ma ...

  5. jsp中四种传递参数的方法

    jsp中四种传递参数的方法如下: 1.form表单 2.request.setAttribute();和request.getAttribute(); 3.超链接:<a herf="i ...

  6. 如何给html元素的onclick事件传递参数(即如何获取html标签的data-*属性)

    现在做的一个小系统为了达到领导所说的很炫的效果有用到Metro UI CSS,但是因为如何给每个磁贴(div标签)的click事件传递参数折腾了蛮久(偶是菜鸟),后来终于找到一个解决方案即通过data ...

  7. Jsp传递参数的方法

    今天老师讲了jsp中四种传递参数的方法,我觉得总结一下,挺好的,以备后用! 1.form表单 2.request.setAttribute();和request.getAttribute(); 3.超 ...

  8. Javascript 定时器调用传递参数的方法

    文章来源:  https://m.jb51.net/article/20880.htm 备注:先记下,以后整理: Javascript 定时器调用传递参数的方法,需要的朋友可以参考下. 无论是wind ...

  9. JSP页面之间传递参数的方法有哪些?

    JSP页面之间传递参数的方法有哪些? 解答: 1)request 2)session 3)application 4)提交表单 5)超链接

随机推荐

  1. JS你可能还不知道的一些知识点(一)

    js程序是用Unicode字符集编写的, 2.转义字符:反斜线 1 2 3 4 function Test(){   var s='you\'re right,it can\'t be a quote ...

  2. python 时间序列resample参数

  3. Mongodb~连接串的整理

    mongodb连接串可以分为普通开放的,带全局用户名和密码的,为指定数据库指定用户名密码的等. 普通开放连接 mongodb://localhost:27017 带全局用户密码的 mongodb:// ...

  4. InnoDB还是MyISAM?

    两种类型最主要的差别就是Innodb 支持事务处理与外键和行级锁.而MyISAM不支持.所以MyISAM往往就容易被人认为只适合在小项目中使用. 我作为使用MySQL的用户角度出发,Innodb和My ...

  5. PHP函数库(core)

    数组函数: array_change_key_case — 返回字符串键名全为小写或大写的数组 array_change_key_case() 将 input 数组中的所有键名改为全小写或大写.改变是 ...

  6. (初学)wpf仿QQ界面-整体布局

    跟一个小学弟一起学习wpf,小学弟是刚初中毕业,对编程刚刚接触,我挺怕自己带的不好,影响小学弟以后在编程方向的学习兴趣.我承认自己水平不高,但是在努力去学习新知识!一起加油吧!在此以博客,记录学习进度 ...

  7. Redis学习1

    Redis 学习记录 简介 redis是一个key-value存储系统.和Memcached类似,它支持存储的value类型相对更多,包括string(字符串).list(链表).set(集合).zs ...

  8. 如何解读IL代码

    如何解读IL代码 关于IL代码,我有将从三个方面去揭开它神秘的面纱.IL代码是什么?我们为什么要去读懂IL代码?我们如何去读懂IL代码?这三个问题的解答,将是我解读IL代码的整体思路. IL代码是什么 ...

  9. react- 相关

    生命周期方法 组件的生命周期分成三个状态: Mounting:已插入真实 DOM Updating:正在被重新渲染 Unmounting:已移出真实 DOM React 为每个状态都提供了两种处理函数 ...

  10. tween.js 插件

    1.是什么? jQueryTween是一款轻量级的jQuery补间动画工具库插件.使用jQueryTween可以制作出各种平滑的动画过渡效果.该插件基于tween.js,旨在简化各种补间动画操作,提供 ...