首页 > 代码库 > javascript事件对象之事件切换器
javascript事件对象之事件切换器
html代码
<!DOCTYPE html><html><head><meta charset="utf-8"><title>jstest</title><link rel="stylesheet" type="text/css" href="style.css"/><script type="text/javascript" src="js.js"></script></head><body> <div id="box" class="red">测试div</div> </body></html>
css代码
@charset "utf-8";.red{width:100px; height:100px; background:#f00;}.blue{width:100px; height:100px; background: blue;}
js代码
//跨浏览器添加事件function addEvent(obj,type,fn){ if(obj.addEventListener){ obj.addEventListener(type,fn,false); }else if(obj.attachEvent){ obj.attachEvent(‘on‘+type,fa); }}//跨浏览器移除事件function removeEvent(obj,type,fn){ if(obj.removeEventListener){ obj.removeEventListener(obj,fn,false); }else if(obj.detachEvent){ obj.detach(‘on‘+type,fn); }}//跨浏览器获取目标对象function getTarget(evt){ if(evt.target){ //w3c return evt.target; }else if(window.event.srcElement){ return window.event.srcElement; }}addEvent(window,‘load‘,function(){ var box = document.getElementById(‘box‘); addEvent(box,‘click‘,toBlue);});function toRed(evt){ var that = getTarget(evt); that.className = ‘red‘; removeEvent(that,‘click‘,toRed); addEvent(that,‘click‘,toBlue);}function toBlue(evt){ var that = getTarget(evt); that.className = ‘blue‘; removeEvent(that,‘click‘,toBlue); addEvent(that,‘click‘,toRed);}
javascript事件对象之事件切换器
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。