问题描述
- JS事件处理函数的一些问题
-
现代的事件处理函数，其递归的原理是什么？
我写了一个事件切换器，原始的一个div颜色为红色，点击后变成蓝色，再点击又变成红色，就这样切换。代码如下：
HTML代码：<head> <style type="text/css"> #box{ width:100px; height:100px; } .red{ background-color:red; } .blue{ background-color:blue; } </style> </head> <body> <div id="box" class="red">颜色切换器</div> </body>JS代码：
//事件添加函数 function addEvent(obj, type, fn){ var saved = null; if(obj.type){ saved = obj.type; } obj.type = function(){ if(saved) saved(); fn.call(this); }; } //事件删除函数 removeEvent(obj, type){ if(obj.type) obj.type = null; } //颜色切换函数 function toBlue(){ this.className = 'blue'; removeEvent(this, 'onclick'); addEvent(this, 'onclick', toRed); } function toRed(){ this.className = 'red'; removeEvent(this, 'onclick'); addEvent(this, 'onclick', toBlue); } //开始执行 addEvent(window, 'onload', function(){ var box = document.getElementById('box'); addEvent(box, 'onclick', toBlue); });当开始执行时，首先点击了div，颜色变蓝，再点击就变红，切换时的运行机理是什么？为何点击后还能继续成功点击？
解决方案
这个和什么递归扯不上关系，无非就是你点了一次，它执行设置颜色的代码，并且把事件关联的处理函数设置为另一个，而另一个函数再设置回来。
remoteevent和addevent就是切换事件。
解决方案二：
js事件处理函数中return的作用
jquery事件处理函数
时间： 2024-09-02 10:24:23