JavaScript事件概览

简介:

JavaScript事件

JavaScript是单线程,在同一个时间点,不可能同时运行两个“控制线程”。

事件句柄和事件对象

1.注册事件句柄

标准和非标准

var button=documenbt.elementByID("#button");
button.addEventListener('click',function(){
    //do something.
},false);
//第三个参数表明事件是否阻止冒泡。true阻止冒泡,false类似默认行为一样进行事件冒泡。
var button=documenbt.elementByID("#button");
button.attachEvent('onclick',function(){
    //do something.
});

早期兼容性代码,查看浏览器支持哪种事件模型:

function registerEventHandler(node,event,handler){
            if(typeof node.addEventListener=='function'){
                node.addEventListener(node,event,handler);
            } else{
                node.attachEvent("on"+event,hander);
            }
        }
registerEventHandler(button,"click",function(){
            //to do
        });

2.获得事件对象

标准 event

非标准: window.event

兼容性代码:

registerEventHandler(document.body,"click",function(event){
            event=event||window.event;
            print(event.clientX,",",event.clientY);
        });

3.从事件对象中获取数据

鼠标事件,event对象中的属性(部分):

4.标记事件已经完成

function unregisterEventHandler(node,event,handler){
            if(typeof node.removeEventListener=='function'){
                node.removeEventListener(node,event,handler);
            } else{
                node.detachEvent("on"+event,hander);
            }
        }
registerEventHandler(button,"click",function(){
            //to do
        });

事件类型

1.鼠标事件,
2.键盘事件
3.停止行为
事件冒泡和阻止默认行为。标准和非标准如下:

阻止事件冒泡:
event.stopPropagation

cancelBubble

阻止默认行为:
event.preventDefault();

returnValue=false;

4.跟踪焦点事件
focusblur

5.表单事件
submit事件

6.window事件

load事件:在文档完全加载完毕时触发

resize事件: 每次窗口发生改变时被触发

scroll事件: 文档滚动的时候,浏览器都会触发window对象上的scroll事件

本文转自快乐八哥博客园博客,原文链接http://www.cnblogs.com/liminjun88/p/5741247.html如需转载请自行联系原作者


快乐八哥

相关文章
|
1月前
|
Web App开发 JavaScript 前端开发
javascript onkeydown事件
javascript onkeydown事件
|
3月前
|
JavaScript 前端开发
js事件队列
js事件队列
139 55
|
1月前
|
JavaScript
js两种移除事件的方法
js两种移除事件的方法
30 2
|
2月前
|
JavaScript 前端开发
JavaScript 事件
JavaScript 事件
34 2
|
3月前
|
JavaScript 前端开发
JavaScript 事件的绑定
JavaScript 事件的绑定
38 0
|
21天前
|
存储 JavaScript 前端开发
js事件队列
【10月更文挑战第15天】
41 6
|
2月前
|
JavaScript 前端开发
JavaScript HTML DOM 事件
JavaScript HTML DOM 事件
22 5
|
24天前
|
JavaScript API
深入解析JS中的visibilitychange事件:监听浏览器标签间切换的利器
深入解析JS中的visibilitychange事件:监听浏览器标签间切换的利器
66 0
|
2月前
|
监控 JavaScript 前端开发
|
2月前
|
JavaScript 前端开发 Java
JavaScript 类知识点概览
概览JavaScript中类的知识点,包括类的定义和实现、添加方法和get/set方法、类的继承和静态方法的使用。通过学生类和人员类的例子,演示了类的构造器、方法定义、继承关系和静态方法的调用。
JavaScript 类知识点概览