当前位置: 移动技术网 > IT编程>开发语言>JavaScript > JS基础之事件的作用和使用实例讲解

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

2019年03月19日  | 移动技术网IT编程  | 我要评论

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    取消

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网