用addEventHandler添加闭包函数,怎样移除?
- HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="X-UA-Compatible" content="IE=7" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>欢迎使用</title> <script type="text/javascript" language="javascript"> function addEventHandler(Target, sEventType, fnHandler) { if (Target.addEventListener) { Target.addEventListener(sEventType, fnHandler, false); } else if (Target.attachEvent) { Target.attachEvent("on" + sEventType, fnHandler); } else { Target["on" + sEventType] = fnHandler; } } function removeEventHandler(Target, sEventType, fnHandler) { if (Target.removeEventListener) { Target.removeEventListener(sEventType, fnHandler, false); } else if (Target.detachEvent) { Target.detachEvent("on" + sEventType, fnHandler); } else { Target["on" + sEventType] = null; } } function Fun(i) { alert(i); } function Test() { var obj = document.getElementById("btnplay"); addEventHandler(obj, "click", function() { Fun(1); }); addEventHandler(obj, "click", function() { Fun(2); }); } </script></head><body> <div id="btnplay" title="test" style="width:40px; height:30px; background:red;" onclick="Fun(3)"></div> <input type="button" value="Test" onclick="Test()" /></body></html>用addEventHandler添加了二个闭包处理函数后,怎么样才能移除呢?
[解决办法]
重定义覆盖click
或者将fn1 fn2赋值
- HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="X-UA-Compatible" content="IE=7" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>欢迎使用</title> <script type="text/javascript" language="javascript"> function addEventHandler(Target, sEventType, fnHandler) { if (Target.addEventListener) { Target.addEventListener(sEventType, fnHandler, false); } else if (Target.attachEvent) { Target.attachEvent("on" + sEventType, fnHandler); } else { Target["on" + sEventType] = fnHandler; } } function removeEventHandler(Target, sEventType, fnHandler) { if (Target.removeEventListener) { Target.removeEventListener(sEventType, fnHandler, false); } else if (Target.detachEvent) { Target.detachEvent("on" + sEventType, fnHandler); } else { Target["on" + sEventType] = null; } } function Fun(i) { alert(i); } var fn1 = function(){ Fun(1); } var fn2 = function(){ Fun(2); } function Test() { var obj = document.getElementById("btnplay"); addEventHandler(obj, "click", fn1); addEventHandler(obj, "click", fn2); } function del(){ var obj = document.getElementById("btnplay"); removeEventHandler(obj, 'click', fn1) removeEventHandler(obj, 'click', fn2) } </script></head><body> <div id="btnplay" title="test" style="width:40px; height:30px; background:red;" onclick="Fun(3)"></div> <input type="button" value="Test" onclick="Test()" /> <input type="button" value="remove fn1 fn2" onclick="del()" /></body></html>