浅谈 javascript 事件处理
更新时间：2015年01月04日 09:50:39 投稿：hebedich
本文向大家简单介绍了javascript的事件处理机制，从事件源，事件操作到事件处理程序都做了简单介绍，并给出了部分示例，这里推荐给大家。
事件处理
一、事件源：任何一个HTML元素（节点），body、div、button
二、事件：你的操作
鼠标：
click 单击
dblick 双击
oncontextmenu 文本菜单
复制代码 代码如下:
<body oncontextmenu="return false">//禁止右键的程序
mouseover 放上
mouseout 离开
mousedown 按下
mouseup 抬起
mousemove 鼠标移动
键盘:
keypress 键盘事件
keyup 抬起
keydown 按下
文档：
load 加载
onload 是页面加载完成之后触发的事件
unload 关闭
breforeunload关闭之前
表单：
focus 焦点事件
blur 失去焦点
submit 提交事件
change 改变事件
其它：
scroll 滚动
selectstart 选择事件
三、事件处理程序
第一种：
格式：<tag on事件="事件处理程序" />
实例：
复制代码 代码如下:
<script>
function show(){
var one=document.getElementById("one");
alert(one.innerText);
}
show();
</script>
<body>
<div id="one">
wwwwwwwwwwwwwwwww
</div>
<input type="button" onclick="show()" value="show">
第二种:
直接在javascript里边对象.on处理程序
复制代码 代码如下:
<div id="two">
你好，脚本之家https://www.jb51.net
</div>
<script>
var one=document.getElementById("two");
one.onclick=function(){
this.style.backgroundColor="red";
}
</script>
第三种：
基本没什么人用
复制代码 代码如下:
<script for="事件源ID" event="事件">事件处理程序</script>
<div id="th">
你好，脚本之家https://www.jb51.net
</div>
<script for="th" event="onclick">
var one=document.getElementById("th");
one.style.backgroundColor="red";
</script>
小伙伴们是否了解了javascript的事件处理了呢，有疑问就给我留言吧。
相关文章
使用过javascript的朋友都知道，在javascript中，变量的使用是个比较头疼的问题，经常会产生 些比较匪夷所思的结果。究其原因，大多是对javascript的变量相关知识了解得不够透彻。2010-05-05
javascript学习笔记之js函数介绍，需要的朋友可以参考下2012-06-06
这篇文章介绍了JavaScript中异常处理的方法，文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2022-05-05
JavaScript基本概念 论坛贴建议大家看下，都是一些js的高级的技巧知识小结。2009-02-02
这篇文章主要介绍了JS 作用域与作用域链详解，十分的细致全面，这里推荐给小伙伴们，有需要的朋友可以参考下。2015-04-04
这篇文章主要介绍了JavaScript函数使用的基本教程,是JS入门学习中的基础知识,需要的朋友可以参考下2015-06-06
在Javascript中只有五种简单类型，分别为null,undefined,boolean,String和Number.一种复杂类型：object。2010-01-01
Event属性想必大家并不陌生吧，本文整理了一些常用的，感兴趣的朋友可以参考下，希望对大家有所帮助2013-09-09
文是JavaScript库Mootools的入门性介绍文章，详细介绍了在网上能找到的比较好的学习HTML,CSS,JavaScript入门知识的资源以及随手参考的地方。文中介绍的从零入手学习JavaScript编程的过程很有参考价值。2008-04-04
javascript确认框的三种使用方法，在开发中经常要用到，记录一下使用方法2013-12-12
最新评论