Mootools 1.2教程(5)——事件处理(4)
作者:Fdream 来源:Fdream博客 时间:2008-11-19 16:33:00
示例
这里是上面我们写过的一些可以执行的代码:
注意:你可以在单击示例上面试一下,不过不是在上面松开鼠标,而是把鼠标一直按着从区块上离开,然后再松开。注意一下它没有触发点击事件。
参考代码:
var keyStrokeEvent = function(event){
// 下面的代码是说:
// 如果按下的键为“k”,则做下面的事
if (event.key == 'k') {
alert("This Mootorial was brought to you by the letter 'k.'")
};
}
var mouseLeaveFunction = function(){
// 在这里添加事件发生时你要执行的任何代码
alert('this element now recognizes the mouse leave event');
}
var mouseEnterFunction = function(){
// 在这里添加事件发生时你要执行的任何代码
alert('this element now recognizes the mouse enter event');
}
var clickFunction = function(){
// 在这里添加事件发生时你要执行的任何代码
alert('this element now recognizes the click event');
}
window.addEvent('domready', function() {
$('click').addEvent('click', clickFunction);
$('enter').addEvent('mouseenter', mouseEnterFunction);
$('leave').addEvent('mouseleave', mouseLeaveFunction);
$('keyevent').addEvent('keydown', keyStrokeEvent);
});
参考代码:
<div id="click" class="block">左键单击(Click)</div><br />
<div id="enter" class="block">鼠标进入(Mouse Enter)</div><br />
<div id="leave" class="block">鼠标离开(Mouse Leave)</div><br />
<input id="keyevent" type="text" value="请输入字符'k'" />
更多学习……
下载一个包含你开始所需要的所用东西的zip包(27.33 KB)
asp之家下载地址:mootorial_day5_events.zip (27.33 KB)
包含MooTools 1.2核心库、一个外部JavaScript文件、一个简单的html页面和一个css文件。
更多关于事件的资料
MooTools给了你更多的关于事件的控制方法,比我们这里讲得要多得多。要学习更多内容,请查看下面几个链接:
MooTools文档中的Events部分
MooTools文档中的Element.Events部分
还有,阅读一下w3school网站上关于JavaScript事件的内容