读书人

用addEventHandler添加闭包函数怎样

发布时间: 2012-05-23 13:44:13 作者: rapoo

用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> 

读书人网 >JavaScript

热点推荐