因为一个bind函数,未解绑成功导致事件叠加,搞了一下午。

keyup事件绑定:

this.$document.on('keyup', this.keyUp.bind(this));

原解绑函数:

 this.$document.off('keyup', this.keyUp);

修正函数:

this.$document.off('keyup');

正如参考链接所提到的API(未详查):

bind方法会创建一个新函数,称为绑定函数.当调用这个绑定函数时,绑定函数会以创建它时传入bind方法的第一个参数作为this,传入bind方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数.

bind会创建一个新函数绑定到keyup上,此时绑定的函数已经不是自定义的keyup,而是和它功能一样的一个匿名函数(据我推导)。而在解绑的时候,第二个参数是自定义的this.keyUp。但是keyup绑定的并不是this.keyUp,导致未能解绑,以致于函数事件叠加。如果keyup每次自增1,关闭之后再打开就变成自增2,在关闭再打开就变成自增3,以此类推。

参考链接:Javascript通过bind()掌控this (http://blog.csdn.net/rznice/article/details/26134201)

jQuery在on绑定事件时,使用Function.prototype.bind上下文,只能用off(event)解绑函数,否则可能导致事件叠加的更多相关文章

  1. JavaScript 函数绑定 Function.prototype.bind

    ECMAScript Edition5 IE9+支持原生,作用为将一个对象的方法绑定到另一个对象上执行. Function.prototype.bind = Function.prototype.bi ...

  2. Function.prototype.bind

    解析Function.prototype.bind 简介 对于一个给定的函数,创造一个绑定对象的新函数,这个函数和之前的函数功能一样,this值是它的第一个参数,其它参数,作为新的函数的给定参数. b ...

  3. 解析Function.prototype.bind

    简介 对于一个给定的函数,创造一个绑定对象的新函数,这个函数和之前的函数功能一样,this值是它的第一个参数,其它参数,作为新的函数的给定参数. bind的作用 bind最直接的作用就是改变this的 ...

  4. Function.prototype.bind、call与apply方法简介

    前言 前段时间面试遇见一题,题目内容大概是 function Parent() { this.prop = 'parent'; } Parent.prototype.get = function() ...

  5. Function.prototype.bind、call与apply

    学习Function.prototype.bind.call与apply时,看到一篇博客,学到一些内容,但由于博客时间太久,根据官方文档对内容进行一些修正:下文为修正过内容 前言 前段时间面试遇见一题 ...

  6. 一起Polyfill系列:Function.prototype.bind的四个阶段

    昨天边参考es5-shim边自己实现Function.prototype.bind,发现有不少以前忽视了的地方,这里就作为一个小总结吧. 一.Function.prototype.bind的作用 其实 ...

  7. Function.prototype.bind接口浅析

    本文大部分内容翻译自 MDN内容, 翻译内容经过自己的理解. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Glo ...

  8. 理解javascript中的Function.prototype.bind

    在初学Javascript时,我们也许不需要担心函数绑定的问题,但是当我们需要在另一个函数中保持上下文对象this时,就会遇到相应的问题了,我见过很多人处理这种问题都是先将this赋值给一个变量(比如 ...

  9. 浅析 JavaScript 中的 Function.prototype.bind() 方法

    Function.prototype.bind()方法 bind() 方法的主要作用就是将函数绑定至某个对象,bind() 方法会创建一个函数,函数体内this对象的值会被绑定到传入bind() 函数 ...

随机推荐

  1. Pipe - POJ 1039(线段相交交点)

    题目大意:有一个不反光并且不透光的管道,现在有一束光线从最左端进入,问能达到的最右端是多少,输出x坐标.   分析:刚开始做是直接枚举两个点然后和管道进行相交查询,不过这样做需要考虑的太多,细节不容易 ...

  2. java第四周学习

    这一周学习的还是面向对象的方法和应用 Java中方法的使用和注意事项 如果没有返回值,就不允许通过return关键字返回结果 方法中不允许嵌套使用 Return返回值只允许返回一个值,不允许返回多个 ...

  3. SQL 存储过程 通过多个ID更新数据 分类: SQL Server 2014-12-08 16:08 299人阅读 评论(0) 收藏

    下面举个例子说明: 我想让一部分品牌的名称(即Brand_Name)后面加上1,Brand_ID是主键,sql语句很容易实现,但是存储过程如何写呢? 错误写法如下: //*************** ...

  4. myeclipse 解决没有自动提示

    有时候myeclipse误操作会丢失自动提示功能,使用.也不出现代码提示,进入window->preferences->java->Editor->Content Assist ...

  5. hibernate之自定义持久化实现

  6. gprof + kprof + gprof2dot (性能 与 函数调用图)-

    http://www.cnblogs.com/rocketfan/archive/2009/11/15/1603465.html http://blog.csdn.net/stanjiang2010/ ...

  7. [转] Express 4 中的变化

    http://www.cnblogs.com/haogj/p/3985438.html 概览 从 Express 3 到Express 4 是一个巨大的变化,这意味着现存的 Express 3 应用在 ...

  8. 一个很简单的SqlServer生成常用C#语句工具的诞生

    前言: 这个文章只要是记录一下,这个工具的诞生过程.作用.其中的技术实在是太简单可以说没有什么技术~主要是锻炼一下写文章的能力! 正文: 在开发项目的时,常常会要维护或变更一些老项目,涉及到简单的几张 ...

  9. IntelliJ Idea 常用快捷键列表(精简版)

    查找快捷键: Ctrl+N 查找类 Ctrl+shift+N 查找文件 Ctrl+B 找变量来源 Ctrl+E 最近打开的文件 Ctrl+Alt+B 选中方法的实现 Ctrl+F7  选中方法(属性. ...

  10. 修改android应用包名 分类: android 学习笔记 2015-07-16 22:48 4人阅读 评论(0) 收藏

    由于项目需要,要修改已经开发好的应用包名,这本身很简单,但是如果你没找到门道,可能会白白浪费许多时间. 修改包名有三个地方要改,这三个地方的修改一定要按顺序来,否则你可能会遇到许多不必要的麻烦. 1. ...