JavaScript 中的事件教程


Posted in Javascript onApril 05, 2007

事件是可以被JavaScript侦测到的行为。
事件
JavaScript使我们有能力创建动态页面。事件是可以被JavaScript侦测到的行为。

网页中的每个元素都可以产生某些可以触发JavaScript函数的事件。比方说,我们可以在用户点击某按钮时产生一个onClick事件来触发某个函数。事件在HTML页面中定义。

事件举例:
鼠标点击 
页面或图像载入 
鼠标悬浮于页面的某个热点之上 
在表单中选取输入框 
确认表单 
键盘按键 
注意:事件通常与函数配合使用,当事件发生时函数才会执行。

如果需要更全面的关于Javascript可识别的事件的知识,请阅读我们的完整版《事件参考手册》。
onload 和 onUnload
当用户进入或离开页面时就会触发onload 和 onUnload事件。

onload事件常用来检测访问者的浏览器类型和版本,然后根据这些信息载入特定版本的网页。

onload 和 onUnload事件也常被用来处理用户进入或离开页面时所建立的cookies。例如,当某用户第一次进入页面时,你可以使用消息框来询问用户的姓名。姓名会保存在cookie中。当用户再次进入这个页面时,你可以使用另一个消息框来和这个用户打招呼:"Welcome John Doe!"。
onFocus, onBlur 和 onChange
onFocus、onBlur和onChange事件通常相互配合用来验证表单。

下面是一个使用onChange事件的例子。用户一旦改变了域的内容,checkEmail()函数就会被调用。

<input type="text" size="30" id="email" onchange="checkEmail()">onSubmit
onSubmit用于在提交表单之前验证所有的表单域。

下面是一个使用onSubmit事件的例子。当用户单击表单中的确认按钮时,checkForm()函数就会被调用。假若域的值无效,此次提交就会被取消。checkForm()函数的返回值是true或者false。如果返回值为true,则提交表单,反之取消提交。

<form method="post" action="xxx.htm" onsubmit="return checkForm()">onMouseOver 和 onMouseOut
onMouseOver 和 onMouseOut用来创建“动态的”按钮。

下面是一个使用onMouseOver事件的例子。当onMouseOver事件被脚步侦测到时,就会弹出一个警告框:

<a href="http://www.w3school.com.cn"
onmouseover="alert('An onMouseOver event');return false">

<img src="w3schools.gif" width="100" height="30">

</a>

Javascript 相关文章推荐
JavaScript中自定义事件用法分析
Dec 23 Javascript
jquery带动画效果幻灯片特效代码
Aug 27 Javascript
JS+CSS实现简易的滑动门效果代码
Sep 24 Javascript
JS+CSS实现的日本门户网站经典选项卡导航效果
Sep 27 Javascript
jQuery实现textarea自动增长宽高的方法
Dec 18 Javascript
js实现表单及时验证功能 用户信息立即验证
Sep 13 Javascript
JavaScript与java语言有什么不同
Sep 22 Javascript
AngularJS 2.0入门权威指南
Oct 08 Javascript
javascript实现对话框功能警告(alert 消息对话框)确认(confirm 消息对话框)
May 07 Javascript
微信小程序之数据绑定原理解析
Aug 14 Javascript
深入理解Vue keep-alive及实践总结
Aug 21 Javascript
vuex state中的数组变化监听实例
Nov 06 Javascript
JavaScript While 循环基础教程
Apr 05 #Javascript
脚本之家贴图转换+转贴工具用到的js代码超级推荐
Apr 05 #Javascript
javascript判断单选框或复选框是否选中方法集锦
Apr 04 #Javascript
javascript中巧用“闭包”实现程序的暂停执行功能
Apr 04 #Javascript
ArrayList类(增强版)
Apr 04 #Javascript
Javascript中的数学函数
Apr 04 #Javascript
Some tips of wmi scripting in jscript (1)
Apr 03 #Javascript
You might like
PHP count()函数讲解
2019/02/03 PHP
php提供实现反射的方法和实例代码
2019/09/17 PHP
Laravel 不同生产环境服务器的判断实践
2019/10/15 PHP
11款基于Javascript的文件管理器
2009/10/25 Javascript
Javascript中匿名函数的多种调用方式总结
2013/12/06 Javascript
jquery判断输入密码两次是否相等
2020/04/22 Javascript
jQuery层次选择器用法示例
2016/09/09 Javascript
AngularJS全局scope与Isolate scope通信用法示例
2016/11/22 Javascript
JS表单数据验证的正则表达式(常用)
2017/02/18 Javascript
js实现三级联动效果(简单易懂)
2017/03/27 Javascript
js 概率计算(简单版)
2017/09/12 Javascript
AngularJS中的路由使用及实现代码
2017/10/09 Javascript
vue2过滤器模糊查询方法
2018/09/16 Javascript
layer设置maxWidth及maxHeight解决方案
2019/07/26 Javascript
ES5和ES6中类的区别总结
2020/12/21 Javascript
Python中列表和元组的使用方法和区别详解
2020/12/30 Python
python访问抓取网页常用命令总结
2017/04/11 Python
Python登录并获取CSDN博客所有文章列表代码实例
2017/12/28 Python
利用numpy和pandas处理csv文件中的时间方法
2018/04/19 Python
Python学习小技巧总结
2018/06/10 Python
解决Pycharm 导入其他文件夹源码的2种方法
2020/02/12 Python
python爬虫爬取淘宝商品比价(附淘宝反爬虫机制解决小办法)
2020/12/03 Python
SKECHERS官方旗舰店:美国舒适运动休闲品牌
2017/12/22 全球购物
Kipling意大利官网:世界著名的时尚休闲包袋品牌
2019/06/05 全球购物
施华洛世奇巴西官网:SWAROVSKI巴西
2019/12/03 全球购物
二手书店创业计划书
2014/01/16 职场文书
大学秋游活动方案
2014/02/11 职场文书
小区消防演习方案
2014/02/21 职场文书
小学生元旦感言
2014/02/26 职场文书
党员个人整改措施
2014/10/24 职场文书
故意伤害罪辩护词
2015/05/21 职场文书
春节晚会开场白
2015/05/29 职场文书
党支部审查意见
2015/06/02 职场文书
《爬天都峰》教学反思
2016/02/23 职场文书
JavaScript 语句之常用 for 循环详解
2021/03/29 Javascript
NodeJs使用webpack打包项目的方法详解
2022/02/28 NodeJs