首页 > 代码库 > 第一百二十节,JavaScript事件对象

第一百二十节,JavaScript事件对象

JavaScript事件对象

 

 

学习要点:

1.事件对象

2.鼠标事件

3.键盘事件

4.W3C与IE

 

JavaScript事件的一个重要方面是它们拥有一些相对一致的特点,可以给你的开发提供更多的强大功能。最方便和强大的就是事件对象,他们可以帮你处理鼠标事件和键盘敲击方面的情况,此外还可以修改一般事件的捕获/冒泡流的函数。

 

一.事件对象

事件处理函数的一个标准特性是,以某些方式访问的事件对象包含有关于当前事件的上下文信息。

事件处理三部分组成:对象.事件处理函数=函数。例如:单击文档任意处。

//在页面任意地方单击鼠标触发事件
document.onclick = function () {
    alert(‘Lee‘);
};

PS:以上程序的名词解释:click表示一个事件类型,单击。onclick表示一个事件处理函数或绑定对象的属性(或者叫事件监听器、侦听器)。document表示一个绑定的对象,用于触发某个元素区域。function()匿名函数是被执行的函数,用于触发后执行。

 

除了用匿名函数的方法作为被执行的函数,也可以设置成独立的函数。

//在页面任意地方单击鼠标触发事件
document.onclick = box;                        //直接赋值函数名即可,无须括号
function box() {
    alert(‘Lee‘);
}

 

this关键字和上下文

在面向对象那章我们了解到:在一个对象里,由于作用域的关系,this代表着离它最近对象。

//<input type="text" value="http://www.mamicode.com/文本"/>
window.onload = function () { //window.onload事件,等待html执行完成后,执行匿名函数
    var input = document.getElementsByTagName(‘input‘)[0];
    input.onclick = function () {
        alert(this.value);                    //HTMLInputElement,this表示input对象
    };
};

 

第一百二十节,JavaScript事件对象