最新的Web开发教程
 

JavaScript事件


HTML事件是“东西”这事发生在HTML元素。

当JavaScript的HTML页面时,JavaScript可以对这些事件“作出反应”。


HTML事件

一个HTML事件可以是事物的浏览器,或一些用户执行。

这里是HTML事件的一些示例:

  • 一个HTML网页加载完毕
  • 一个HTML输入字段被改变
  • 一个HTML按钮被点击

通常,当事件发生时,你可能想要做的事。

JavaScript允许在检测到事件时执行代码。

HTML允许事件处理程序的属性, 以JavaScript代码 ,要添加到HTML元素。

单引号:

< some-HTML-element some-event = ' some JavaScript ' >

用双引号:

< some-HTML-element some-event = " some JavaScript " >

在下面的例子中,一个onclick属性(代码),被加入到一个按钮元素:

<button onclick='getElementById("demo").innerHTML=Date()'>The time is?</button>
试一试»

在上面的例子中,JavaScript代码改变元素的含量与id="demo"

在下面的例子中,代码改变自己的元素(使用的内容, this .innerHTML ):

<button onclick="this.innerHTML=Date()">The time is?</button>
试一试»

JavaScript代码常常是几线长。 更常见的是看事件属性调用函数:

<button onclick="displayDate()">The time is?</button>
试一试»

常见的HTML事件

这里是一些普通的HTML事件的列表:

事件 描述
onchange HTML元素已被改变
onclick 用户点击一个HTML元素
onmouseover 用户在一个HTML元素上移动鼠标
onmouseout 用户从一个HTML元素上移动鼠标离开
onkeydown 用户按下键盘键
onload 该浏览器已完成加载页面

这份名单是更长的时间: w3ii javascript参考HTML DOM事件


有什么可以做的JavaScript?

事件处理程序可以用来处理和验证,用户输入,用户的操作,和浏览器操作:

  • 事情应该做的每一次页面加载
  • 东西的时候页面被关闭了应该做的事
  • 当用户点击一个按钮,应该执行的操作
  • 内容应被验证时,用户输入数据
  • 和更多 ...

许多不同的方法可用于让与事件的JavaScript工作:

  • HTML事件属性可以直接执行JavaScript代码
  • HTML事件属性可以调用JavaScript函数
  • 您可以指定自己的事件处理函数HTML元素
  • 您可以阻止发送或正在处理事件
  • 和更多 ...

你会学到很多东西更多有关事件和事件处理HTML DOM的章节。


自测练习用!

练习1» 练习2» 练习3»