的用法示例介绍,add伊夫ntListener使用介绍

时间:2019-07-30 21:17来源:2020欧洲杯冠军竞猜官方网站
document.addEventListener("事件名称", 函数, false); 或许你也境遇过这种情形,正是在js的代码中用了window.onload后,大概会默转潜移到body中的onload事件。你能够全写在body中,也能够全放到window.

document.addEventListener("事件名称", 函数, false);

或许你也境遇过这种情形,正是在js的代码中用了window.onload后,大概会默转潜移到body中的onload事件。你能够全写在body中,也能够全放到window.onload中,可是这样并不是很平价,不时我们供给四个相同的时间用到。这时将在用window.attachEvent和window.add伊夫ntListener来缓慢解决一下。

(要小心的是div必须置于js后面才行)

复制代码 代码如下:

2020欧洲杯冠军竞猜官方网站,下边是贰个解决方法。至于attach伊芙nt和addEventListener的用法,能够友善谷歌或百度时而。

相似景色下,要是给叁个dom对象绑定同贰个事变,唯有最后多少个会收效,例如:

function 某函数(event){
// 方法执行
}

复制代码 代码如下:

复制代码 代码如下:

add伊芙ntListener里最后二个参数决定该事件的响应顺序;

if (document.all){
window.attachEvent('onload',函数名)//IE中
}
else{
window.addEventListener('load',函数名,false);//firefox
}

document.getElementById("btn").onclick = method1;
document.getElementById("btn").onclick = method2;
document.getElementById("btn").onclick = method3;

比方为true事件推行各样为 add伊芙ntListener ---- 标签的onclick事件 ---- document.onclick 

在前段时间的行事中,用到了attach伊夫nt方法,该格局可以为某一平地风波附加别的的处管事人件,一时候大概相比较有用,这里将其主题用法总括一下。

那么将唯有method3生效。

若是为false事件的逐个为 标签的onclick事件 ---- document.onclick ---- add伊芙ntListener

其语法能够查看《DHTML手册》,里面有详尽的表达,这里贴一个例子,该例子来自网络:

借使是Mozilla体系,用add伊夫ntListener能够让七个事件按梯次都落到实处,比方:

了然为别的代码的调用入口

复制代码 代码如下:

复制代码 代码如下:

您或然感兴趣的小说:

  • Javascript 的add伊芙ntListener()及attachEvent()不相同分析
  • addEventListener 的用法示例介绍
  • window.add伊夫ntListener来消除让多个js事件实践几个函数
  • JS在IE和FF下attach伊夫nt,addEventListener学习笔记
  • 事件绑定之小测量检验 onclick && addEventListener
  • javascript attach伊芙nt和add伊芙ntListener使用格局
  • 详解add伊夫ntListener的八个参数之useCapture
  • addEventListener()第两个参数useCapture (Boolean)详细深入分析
  • 讲两件事:1.this指针的用法小探. 2.ie的attachEvent和firefox的addEventListener在事件管理上的区别
  • addEventListener()与removeEventListener()解析

document.getElementById("btn").onclick = method1;
document.getElementById("btn").onclick = method2;
document.getElementById("btn").onclick = method3;

var btn1Obj = document.getElementById("btn1");
//element.addEventListener(type,listener,useCapture);
btn1Obj.addEventListener("click",method1,false);
btn1Obj.addEventListener("click",method2,false);
btn1Obj.addEventListener("click",method3,false);

假诺如此写,那么将会独有medhot3被奉行

奉行各类为method1->method2->method3

写成那样

假诺是ie类别,用attach伊芙nt能够让四个事件按梯次都实现,比方:

复制代码 代码如下:

复制代码 代码如下:

var btn1Obj = document.getElementById("btn1");
//object.attachEvent(event,function);
btn1Obj.attachEvent("onclick",method1);
btn1Obj.attachEvent("onclick",method2);
btn1Obj.attachEvent("onclick",method3);

var btn1Obj = document.getElementById("btn1");
//object.attachEvent(event,function);
btn1Obj.attachEvent("onclick",method1);
btn1Obj.attachEvent("onclick",method2);
btn1Obj.attachEvent("onclick",method3);

试行顺序为method3->method2->method1

执行各种为method3->method2->method1

假定是Mozilla种类,并不帮衬该格局,需求利用add伊夫ntListener

=======================================================

复制代码 代码如下:

Mozilla中:

var btn1Obj = document.getElementById("btn1");
//element.addEventListener(type,listener,useCapture);
btn1Obj.addEventListener("click",method1,false);
btn1Obj.addEventListener("click",method2,false);
btn1Obj.addEventListener("click",method3,false);

add伊芙ntListener的选用形式

举行各种为method1->method2->method3

target.addEventListener(type,listener,useCapture);

你恐怕感兴趣的篇章:

  • Javascript 的addEventListener()及attach伊芙nt()分歧深入分析
  • addEventListener 的用法示例介绍
  • document.addEventListener使用介绍
  • JS在IE和FF下attachEvent,addEventListener学习笔记
  • 事件绑定之小测验 onclick && add伊芙ntListener
  • javascript attachEvent和add伊夫ntListener使用方式
  • 详解add伊芙ntListener的八个参数之useCapture
  • add伊芙ntListener()第多个参数useCapture (Boolean)详细剖判
  • 讲两件事:1.this指针的用法小探. 2.ie的attachEvent和firefox的addEventListener在事件管理上的分别
  • addEventListener()与removeEventListener()解析

target: 文书档案节点、document、window 或 XMLHttpRequest。
type: 字符串,事件名称,不含“on”,比如“click”、“mouseover”、“keydown”等。
listener :完结了 伊芙ntListener 接口或许是 JavaScript 中的函数。
useCapture :是或不是使用捕捉,一般用 false 。比如:document.getElementById("testText").addEventListener("keydown", function (event) { alert(event.keyCode); }, false);

IE中:

target.attachEvent(type, listener);
target: 文书档案节点、document、window 或 XMLHttpRequest。
type: 字符串,事件名称,含“on”,比方“onclick”、“onmouseover”、“onkeydown”等。
listener :完毕了 伊夫ntListener 接口或许是 JavaScript 中的函数。 举个例子:document.getElementById("txt").attachEvent("onclick",function(event){alert(event.keyCode);});

W3C 及 IE 同有时间扶助移除内定的平地风波, 用途是移除设定的轩然大波, 格式分别如下:

removeEventListener(event,function,capture/bubble);

Windows IE的格式如下:

detachEvent(event,function);

DOM2 的进化:

DOM 0 Event DOM 2 Event
onblur() blur
onfocus() focus
onchange() change
onmouseover() mouseover
onmouseout() mouseout
onmousemove() mousemove
onmousedown() mousedown
onmouseup() mouseup
onclick() click
ondblclick() dblclick
onkeydown() keydown
onkeyup() keyup
onkeypress() keypress
onsubmit() submit
onload() load
onunload() unload

新的DOM2 用法可以addEventListener()这几个函数来考查到:

复制代码 代码如下:

addEventListener(event,function,capture/bubble);

参数event如上表所示, function是要实行的函数, capture与bubble分别是W3C制订得二种时光形式,轻松的话capture就是从document的上马读到最终一行, 再实践事件, 而bubble则是先找找钦定的职责再进行事件.
capture/bubble的参数是布尔值, True表示用capture, False则是bubble.Windows Internet Explorer也会有制订一种伊芙ntHandler, 是 attach伊夫nt(), 格式如下:

复制代码 代码如下:

window.attachEvent(”submit”,myFunction());

正如特其他是attach伊夫nt无需钦命capture/bubble的参数, 因为在windows IE意况下都是接纳Bubble的情势.

什么推断是还是不是援救哪一种监听呢?如:

复制代码 代码如下:

if (typeof window.addEventListener != “undefined”) {
window.addEventListener(”load”,rollover,false);
} else {
window.attachEvent(”onload”,rollover)
}

上述的 typeof window.addEventListener != “undefined” 程序代码能够看清使用者的浏览器是或不是扶助AddEventListener那几个事件模型, 假若不协助就选用attach伊芙nt.

W3C 及 IE 同有的时候候补助移除钦定的事件, 用途是移除设定的风云, 格式分别如下:

W3C格式:

removeEventListener(event,function,capture/bubble);

Windows IE的格式如下:

detachEvent(event,function);

您恐怕感兴趣的小说:

  • Javascript 的addEventListener()及attachEvent()分化深入分析
  • window.addEventListener来消除让三个js事件实行三个函数
  • document.add伊芙ntListener使用介绍
  • JS在IE和FF下attachEvent,add伊夫ntListener学习笔记
  • 事件绑定之小测量检验 onclick && add伊芙ntListener
  • javascript attachEvent和add伊夫ntListener使用方式
  • 详解addEventListener的四个参数之useCapture
  • addEventListener()第三个参数useCapture (Boolean)详细深入分析
  • 讲两件事:1.this指针的用法小探. 2.ie的attach伊芙nt和firefox的addEventListener在事件管理上的界别
  • addEventListener()与removeEventListener()解析

编辑:2020欧洲杯冠军竞猜官方网站 本文来源:的用法示例介绍,add伊夫ntListener使用介绍

关键词: 欧洲杯竞猜