学习笔记三:学用mootools的Event对象

mootools的Event类很简单,方法少,属性比较齐全:

方法:
stop:停止事件分发
stopPropagation:停止事件继续向上传播
preventDefault:阻止默认行为的处理
bindWithEvent:绑定元素的事件

属性:
shift 是否按下了SHIFT键
control 是否按下了CTRL键
alt 是否按下了ALT键
meta 是否按下了META键(晕一个,META是什么键?)
code 按下键的编码keycode
page.x 鼠标相对于整个窗口的 x 偏移位置
page.y 鼠标相对于整个窗口的 y 偏移位置
client.x 鼠标相对于当前视口的 x 偏移位置
client.y 鼠标相对于当前视口的 y 偏移位置
key 这个变量记录按下的键盘的小写字母,如'a','w',也记录特殊的按键,如‘enter’, ‘up’, ‘down’, ‘left’, ‘ right’, ‘space’, ‘backspace’, ‘delete’, ‘esc’.  这些特殊键的描述很方便
target 事件的目标,如href
relatedTarget 事件的关联目标


代码示例如下:testEvent.html
<head>
<title>测试Event</title>
<meta http-equiv="content-type" content="text/html; charset=gb2312"/>
<script type="text/javascript" src="./js/mootools.v1.00.js?v=1"></script>
</head>
<body>

<textarea id=content cols=80 rows=20>
</textarea>

<div id=id_div>
<id=id_a href='http://www.baidu.com' target='_blank'>测试事件</a>
</div>

<script language="javascript" type="text/javascript">

var flags = 0;

function log(msg){
    $('content').value 
+= msg + '\n';
}

function clear(){
    $('content').value
='';
}


// 绑定div的单击事件
$('id_div').onclick=function(event){
    
var event = new Event(event);
    log('
<div>-onclick, target='+event.target);
}


function a_onclick(event){
    clear();
    
    
var event = new Event(event);
    
if(flags==0){
        log('这一次属正常的事件派发,你将看到百度的页面会弹出');
        flags
++;
    }
else if(flags==1){
        log('这一次的事件将终止向上传播,不派发给
<div>对象,单<a>对象的事件将继续,你应该还是可以看到百度页面');
        flags
++;
        event.stopPropagation();
    }
else if (flags==2){
        log('这一次的事件将不执行
<a>的默认处理,你应该没有看到百度页面的弹出');
        flags
++;
        event.preventDefault();
    }
else{
        log('这一次的事件就此停止,既不执行
<a>的默认处理,也不向父对象<div>传播');
        flags
=0;
        event.stop();
    }

    
    log('
<a>-onclick, target='+event.target);
}


// 另一种绑定事件的方法,利用了事件类的bindWithEvent方法
$('id_a').onclick=a_onclick.bindWithEvent($('id_a'));

</script>

</body>
</html>

posted on 2007-04-05 16:26 PeakGao 阅读(1302) 评论(0)  编辑 收藏 引用 所属分类: JavascriptHTML


只有注册用户登录后才能发表评论。
网站导航: 博客园   IT新闻   BlogJava   知识库   博问   管理


<2024年11月>
272829303112
3456789
10111213141516
17181920212223
24252627282930
1234567

导航

统计

常用链接

留言簿(9)

随笔分类(67)

随笔档案(65)

搜索

最新评论

阅读排行榜

评论排行榜