关于js中的事件监听大家用的比较多了,无非是判断浏览器是否支持addEventListener和attachEvent,网上搜索关于事件监听的方法也挺多,但是总有些不是很完善。下面的方法中对于添加事件监听的方法是一样的,只不过在取消事件绑定上面做了点手术,现在可以支持匿名函数的使用,所以在绑定事件的时候不再需要给函数单独命名了。
主要代码:
/*绑定事件与取消绑定*/ var handleHash = {}; var bind = (function() { if (window.addEventListener) { return function(el, type, fn, capture) { el.addEventListener(type, function(){ fn(); handleHash[type] = handleHash[type] || []; handleHash[type].push(arguments.callee); }, capture); }; } else if (window.attachEvent) { return function(el, type, fn, capture) { el.attachEvent("on" + type, function(){ fn(); handleHash[type] = handleHash[type] || []; handleHash[type].push(arguments.callee); }); }; } })(); var unbind = (function(){ if (window.addEventListener) { return function(el, type ) { if(handleHash[type]){ var i = 0, len = handleHash[type].length; for (i; i<len ; i += 1){ el.removeEventListener(type, handleHash[type][i]); } }; }; } else if (window.attachEvent) { return function(el, type) { if(handleHash[type]){ var i = 0, len = handleHash[type].length; for (i; i<len ; i += 1){ el.detachEvent("on" + type, handleHash[type][i]); } }; }; } })();
原理解析:
handleHash做哈希表缓存事件的function,handleHash['事件名称']是一个数组,来添加多个事件监听的方法,unbind哪个事件的时候遍历handleHash['事件名称']的数组,然后移除。
使用:
bind(obj,'click',function(){ alert ('click'); }); unbind(obj,'click');
本文向大家介绍使用匿名函数的JavaScript封装,包括了使用匿名函数的JavaScript封装的使用技巧和注意事项,需要的朋友参考一下 面向对象的编程语言允许使用私有字段隐藏数据。他们使用这些来隐藏类的内部。在JS中,没有这样的构建支持来隐藏/封装内部工作。 我们有Anonymous函数,可以为您封装JS。让我们看一个例子- 示例 如果我们将上面的代码公开地写出来,则此代码将使用这些名称污染全
问题内容: 无论如何,要删除这样添加的事件侦听器: 不更换元素? 问题答案: 除非您在创建时存储了对事件处理程序的引用,否则无法彻底删除事件处理程序。 我通常会将它们添加到该页面上的主要对象中,然后在处理完该对象后可以对其进行迭代和清理。
问题内容: 摘要 您能解释JavaScript中封装的匿名函数的语法背后的原因吗?为什么起作用:但这不起作用? 我知道的 在JavaScript中,将创建一个命名函数,如下所示: 您还可以创建一个匿名函数并将其分配给变量: 您可以通过创建一个匿名函数来封装代码块,然后将其包装在方括号中并立即执行: 在创建模块化脚本时,这很有用,以避免因潜在冲突的变量而使当前范围或全局范围混乱(例如Greasemo
本文向大家介绍自己封装的javascript事件队列函数版,包括了自己封装的javascript事件队列函数版的使用技巧和注意事项,需要的朋友参考一下 背景 javascript中使用addEventListener()或attachEvent()绑定事件时会有几个小问题: 一、使用addEventListener()或attachEvent()添加的匿名函数无法移除。 二、ie6-ie8中,使用
在开发一个谷歌浏览器插件, 已有的功能都是通过点击按钮实现的 : 界面内有很多按钮,每个对应不同的功能。所以直接监听了整个document的click事件。 document.addEventListener('click'...) 现在想在插件界面内加一个checkbox,发现它的监听事件没有起作用,checkbox无法勾选。 用onclick实现也不行。 但是如果把document.addEv
ts创建一个Input,添加事件监听器,函数类型报错?