Event 对象
Event 对象
Event 对象代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。
事件通常与函数结合使用,函数不会在事件发生前被执行!
事件句柄 (Event Handlers)
HTML 4.0 的新特性之一是能够使 HTML 事件触发浏览器中的行为,比如当用户点击某个 HTML 元素时启动一段 JavaScript。下面是一个属性列表,可将之插入 HTML 标签以定义事件的行为。
提示
- 写在非script标签里面的JavaScript代码,如:
onclick="fn()"
。会自动进行 eval 转化,里面的任何字符都会当成代码来执行,如onclick='return false'
。 - 写在script标签里的代码,如:
onclick=someCode
。
一般情况下,为函数。 - 下面事件属性所有语法皆为script标签的用法。
鼠标事件
1. onclick
在元素被点击时发生
HTML标签支持
除了 :<base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>, 和 <title>以外,
都支持。
浏览器支持
IE | firefox | safari | opera | |
---|---|---|---|---|
true | true | true | true | true |
语法
ElementObject.onclick=function
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<title>zsh</title>
</head>
<body>
<div id="div" name="My div" style='height:500px;'></div>
</body>
<script>
div.onclick=function(){
alert("图像加载出错,请重新刷新页面。");
}
</script>
</html>
2. oncontextmenu
在元素中用户右击鼠标时触发并打开上下文菜单
浏览器支持
IE | firefox | safari | opera | |
---|---|---|---|---|
true | true | true | true | true |
注意
所有浏览器都支持 oncontextmenu 事件, contextmenu 元素只有 Firefox 浏览器支持。
语法
ElementObject.oncontextmenu=function
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<title>zsh</title>
</head>
<body>
<input id="div" name="My div"/>
</body>
<script>
div.oncontextmenu = function(){
return false;
}
</script>
</html>
3. ondblclick
在对象被双击时发生
HTML标签支持
除了 :<base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <