Mootools 1.2教程(5)——事件处理
作者：Fdream 来源：Fdream博客 时间：2008-11-19 16:33:00
原文地址：30 Days of Mootools 1.2 Tutorials - Day 5 - Event Handling
MooTools 1.2中的事件处理
今天我们开始第五讲，在上一讲（《Mootools 1.2教程(4)——函数》）中，我们学习了在MooTools 1.2中建立和使用函数的几种不同方式。下一步就是理解事件了。和选择器类似，事件也是建立互动界面的一个重要部分。一旦你掌握了一个元素，你需要去决定什么行为来触发什么效果。先把效果留着以后在讲，我们首先看一看中间步骤和一些常见的事件。
左键单击事件
左键单击事件是web开发中最常见的事件。超链接识别点击事件，然后把你带到另外一个URL地址。MooTools能够识别其他DOM元素上的点击事件，在设计和功能上给了你极大的灵活性。给一个元素添加一个点击事件的第一步：
参考代码：
// 通过$('id_name') 取得一个元素
// 用.addEvent添加事件
// ('click')定义了事件的类型
$('id_name').addEvent('click', function(){
// 在这里添加点击事件发生时你要执行的任何代码
alert('this element now recognizes the click event');
});
你也可以把这个函数从.addEvent();独立出来来完成相同的事情：
参考代码：
var clickFunction = function(){
// 在这里添加事件发生时你要执行的任何代码
alert('this element now recognizes the click event');
}
window.addEvent('domready', function() {
$('id_name').addEvent('click', clickFunction);
});
参考代码：
<body>
<div id="id_name"> <! -- this element now recognizes the click event -->
</div>
</body>
注意：和超链接识别点击事件一样，MooTools的点击事件实际上也是识别“mouse up”，意味着当你鼠标松开是发生，而不是鼠标按下去的时候发生。这就给了用户一个机会去改变他们的主意——只要在松开之前把鼠标的指针从点击的元素上移开就可以了。
0
投稿猜你喜欢
vue.js中使用echarts实现数据动态刷新功能
使用JS轻松实现ionic调用键盘搜索功能(超实用)
浅谈Pycharm的项目文件名是红色的原因及解决方式
vue实现移动端轻量日期组件不依赖第三方库的方法
Windows使用GitHub Desktop详解
解决更改AUTH_USER_MODEL后出现的问题
用sql实现18位身份证校验代码分享 身份证校验位计算
基于Python+Tkinter实现一个简易计算器
在pyqt5中展示pyecharts生成的图像问题
textarea的输入限制统计代码statInput
Python urllib3软件包的使用说明
Python 字符串与数字输出方法
sqlserver 数据库学习笔记
Django Admin设置应用程序及模型顺序方法详解
Python可视化Matplotlib折线图plot用法详解
thinkPHP删除前弹出确认框的简单实现方法
使用Vue-router二级路由跳转另一条路由下的子级
用Python创建声明性迷你语言的教程
基于go实例网络存储协议详解
python、Matlab求定积分的实现
