JavaScript Event学习补遗 addEventSimple

2024-08-05 00:53:08

代码如下:

function addEventSimple(obj,evt,fn) {
    if (obj.addEventListener)
        obj.addEventListener(evt,fn,false);
    else if (obj.attachEvent)
        obj.attachEvent('on'+evt,fn);
}

function removeEventSimple(obj,evt,fn) {
    if (obj.removeEventListener)
        obj.removeEventListener(evt,fn,false);
    else if (obj.detachEvent)
        obj.detachEvent('on'+evt,fn);
}

用法如下：

代码如下:

addEventSimple(element,'click',functionname);
addEventSimple(document,'load',functionname2);

现在如果元素element被点击的话就会触发functionaname，同样的document也有了onload的事件处理程序functionname2。

缺陷：this关键字在IE下面不是你想象的指向触发事件的元素，而是指向整个文档。

原文地址：http://www.quirksmode.org/js/eventSimple.html

回老家过年了，不能及时发布了，来年继续，大家新年快乐！

转载请保留以下信息
作者：北玉(tw:@rehawk)
文章出处：beiyu.cnblogs.com

JavaScript Event学习补遗 addEventSimple

复制代码代码如下: function addEventSimple(obj,evt,fn) { if (obj.addEventListener) obj.addEventListener(evt,fn,false); else if (obj.attachEvent) obj.attachEvent('on'+evt,fn); } function removeEventSimple(obj,evt,fn) { if (obj.remo
JavaScript Event学习第二章 Event浏览器兼容性

在这里提出的事件,当他们发生在一个确定的HTML元素上的时候,他们的名字能够被大多数的浏览器所识别.也就是说,浏览器会查找你为这个HTML元素所注册的事件处理程序的脚本,而且会被立即执行. 一开始只有为数很少的一些事件.这些事件在几乎所有的JavaScript浏览器都能运行,即使是那些非常古老的.需要注意的是那些早期的事件只能工作在链接或者表单上,有时候也能运行在整个窗口上,但是其他的大多数HTML元素不行. 时代变迁,很多新的事件也给大家介绍过了.第四代浏览器和更高级的浏览
JavaScript Event学习第四章传统的事件注册模型

在最古老的JavaScript浏览器里注册事件只能通过内联模式.自从DHTML从根本上改变了你操作页面的方法,事件的注册就必须有扩展性而且要有很强的适应性.所以就必须有相应的事件模型.Netscape在第三代浏览器中就开始了,IE在第四代浏览器开始. 因为Netscape 3就开始支持这种新的事件注册模型,在浏览器战争前就是事实上的标准.所以微软不得不也是最后一次为了网上那些数不清的使用了Netscape事件处理模型的页面在兼容性上做出了让步. 所以这两个浏览器,事实上也是所有的浏览器都支持下面
JavaScript Event学习第七章事件属性

当我们想去读一读关于Event的一些资料时,常常会湮没在大量的属性里面,这些属性其中的大多数不能良好的运行在大多数的浏览器.这里有event的兼容性列表. 我不打算给这些属性列个表,因为那些情况实在是太让人晕头了,而且对你的学习也不会有一点点的帮助.在写5段代码前我先要问关于浏览器的5个问题. 1.event的类型(type)是什么? 2.哪一个HTML元素是event的目标呢? 3.哪些键在event发生时被按下了? 4.哪个鼠标键在Event发生时被按下了? 5.在Event发生时鼠标的位置
JavaScript Event学习第六章事件的访问

现在我们已经注册了事件处理程序,对于事件我们还想更深入的了解.我们想知道事件发生时候的鼠标位置,我们想知道用户按下了哪些键.这些都是可能的,虽然这部分有很多烦人的浏览器兼容性问题.(这里可以快速查看浏览器兼容性列表). 要读出事件的属性,必须要先能访问到事件. 浏览器兼容性站在浏览器战争的角度看,Netscape实现了一个访问模型(后来被W3C做借鉴)和很多的事件属性,同时微软也做了同样的事情.当然这两种模型是完全不兼容的.但是就像我们再简介里面说的,如果复制代码代码如下: if (W3C
JavaScript Event学习第三章早期的事件处理程序

这些古老的浏览器只支持一种注册事件处理程序的方法,这个方法是Netscape发明的.因为Netscape先发制人,所以如果微软也想做支持JavaScript事件的浏览器就得跟着Netscape走,所以这里没有兼容性的问题.所以这种模式在任何支持JavaScript的浏览器都能运行---除了Mac上的IE3,他根本就不支持事件. 注册事件处理程序在内联式的事件注册模型中,事件处理程序就像是一个HTML元素的属性,比如: <A HREF="somewhere.html" onCli
JavaScript Event学习第八章事件的顺序

基本问题很简单.假设你的一个元素包含在另外一个元素中. 复制代码代码如下: ----------------------------------- | element1 | | ------------------------- | | |element2 | | | ------------------------- | ----------------------------------- 这两个元素都有onclick事件处理程序.如果用户在element2上面单击那么在元素2和元素1上都
JavaScript Event学习第五章高级事件注册模型

W3C和微软都着力于发展自己的事件注册模型来取代Netscape的传统模型.虽然对于微软的模型我不是很感冒,但是w3c的还是不错的,除了这个鼠标定位的问题.不过现在只有小部分浏览器支持. W3C W3C的DOM层面事件规范注意到了传统模式的问题.他对于你想在一个元素上绑定多个事件提供了一个很好的解决办法. W3C事件注册模型的关键就是addEventListener().你给他三个参数:事件类型,要执行的函数和一个布尔值(true或者false)我一会再解释.把我们熟知的doSomething
JavaScript Event学习第九章鼠标事件

先看看都有哪些鼠标事件:mousedown,mouseup_and_click,dblclick,mousemove和mouseover mouseout.然后还会解释一下relatedTarget,fromElement和toElement这些事件属性.最后是微软的mouseenter和mouseleave事件. 浏览器的兼容性问题,可以在浏览器兼容性列表查看. 例子这里有一个例子.可以帮助理解下面的内容. mousedown,mouseup,click和dblclick在这个链接上注册.可
JavaScript Event学习第十章一些可替换的事件对

测试的局限性这一章我们打算寻找哪些事件可以用来仿真鼠标事件.注意这一系列测试不包括屏幕阅读器.因为我不能满足所有的条件,因此测试也有局限性.这个测试目标仅仅只是那些在图形界面下的浏览器中不使用鼠标的用户. 我假设这些测试一样可以用来在一些移动设备上.因为条件不足,所以也不能测试.很多时候在移动设备上表现总是不尽如人意. 总结不幸的是,我们不能制定一个严格的鼠标事件和非鼠标的一对一的方案,因为非鼠标事件和鼠标事件有很多不同.所以下面的建议在大多数场合适用,但不是所有. 下面就是我的测试结果:

JavaScript Event学习补遗 addEventSimple

相关推荐

随机推荐