November « 2009 « 虫子也有理想

2009年11月06日

Dom Event 的 target 属性

使用mootools开发javascript程序的时候，遇到一个问题，点击某链接显示一图层，然后在此图层之外的任何位置点击鼠标让图层隐藏。
费了老牛劲，都没弄好，昨晚观摩某calendar的js程序的时候，学习到了，记录一下，分享给大家：

Html代码:
<body> <a href=”javascript:void(0)” id=”trigger”>show</a> <div id=”layer” style=”width:200px;height:100px;background:#FF4500;display:none”> </div> </body>

JavaScript:
window.addEvent(‘domready’, function() { $(‘trigger’).addEvent(‘click’,function(){ $(‘layer’).setStyle(‘display’,'block’); }); document.addEvent(‘mousedown’,function(ev){ var target = ev.target; if(target.id == ‘trigger’ || target.id == ‘layer’){ $(‘layer’).fade(‘in’); }else{ $(‘layer’).fade(‘out’); } }) })

关键代码就是ev.target, 这个变量就是鼠标触发时点击到的DOM对象，通过判断target的id号就可以实现我上面所描述的功能。
延伸阅读: HTML DOM Event Object

作者: Liuyang 发表于2009年11月06日 16:15 评论(3)

虫子也有理想 – Bugsidea:Blog

Dom Event 的 target 属性

搜索

分类

最近评论

Powered