JS基础之事件的作用和使用实例讲解

var oevent=ev||event;

这一句这么写是要兼容各个，

在firefox浏览器中，事件绑定的函数要获取到事件本身，需要从函数中传入，而ie等浏览器则可以直接使用event或者window.event得到事件本身。

这一句的用途：需要获取和事件相关的信息时使用。如：

获取键盘按下或弹起的按键

获取鼠标的位置坐标

获取出发改事件的元素

获取事件名称

获取事件当前的传播阶段

获取事件生成的日期时间

至于上面这些怎么获取，可补一下js事件方面的相关函数和属性。

例子：

<p id="dd"> </p>

o=document.getelementbyid("dd");

o.onclick=function (ev){

var oevent=ev||event;

alert(oevent.screenx);

} 

获取事件对象和事件源(触发事件的元素) :

function eventhandler(e){ 

//获取事件对象 

e = e || window.event;//ie和chrome下是window.event ff下是e 

//获取事件源 

var target = e.target || e.srcelement;//ie和chrome下是srcelement ff下是target 

} 

取消事件默认行为(例如点击一个<a>后不跳转页面而是执行一个函数):

function eventhandler(e) { 

e = e || window.event; 

// 防止默认行为 

if (e.preventdefault) { 

e.preventdefault();//ie以外 

} else { 

e.returnvalue = false;//ie 

//注意：这个地方是无法用return false代替的 

//return false只能取消元素 

} 

} 

阻止事件冒泡:

function myparagrapheventhandler(e) { 

e = e || window.event; 

if (e.stoppropagation) { 

e.stoppropagation();//ie以外 

} else { 

e.cancelbubble = true;//ie 

} 

} 

事件处理

一、事件源：任何一个html元素(节点) body, p, button, p, a, h1......

二、事件：你的操作

鼠标：

click (单击)

dblclick (双击)

contextmenu (文本菜单)常在body上用

mouver (放上)

mouseout (离开)

mousedown (按下)

mouseup (抬起)

mousemove (移动)

键盘：

keypress (键盘事件)

keyup (抬起)

keydown (按下)

文档：

load (加载)

unload (关闭)

beforeunload (关闭之前)

表单：

focus (焦点)

blur (失去焦点)

submit (提交事件)

change (改变)

其他：

scroll (滚动时间)

selectd (选择事件)

。。。。。。

三、事件处理程序

有三种方法加事件

第一种：

格式：<tag    on事件="事件处理程序"/>

第二种：

<script>

对象.on事件=事件处理程序

</script>

第三种：(已经不常用)

<script  for="事件源id" event="事件">事件处理程序</script>

事件对象  event>>>>>>window.event

属性：

1、srcelement 代表事件源对象

2、keycode 事件发生时的键盘码  (keypress,keydown,keyup)

3、clientx,clienty  鼠标在浏览器的坐标

4、screenx.screeny  鼠标在屏幕上的坐标

5、returnvalue

6、cancelbubble    取消