先看个例子: document.getElementById("myBtn").addEventListener("click", function(){ document.getElementById ("demo").innerHTML = "Hello World"; }); 1 2 3 定义和用法 addEventListener() 方法用于向指定元素添加事件句柄。 提示: 使用 removeEventListener() 方法来移除 addEventListener() 方法添加的事件句柄。 语法 element.addEventListener(event, function, useCapture) 1 参数值 event 必须。字符串,指定事件名。
window.onload = function(){ var p = document.getElementById("content"); if(document.addEventListener ) p.addEventListener("click",function(){ alert("p点击了"); },false); else p.attachEvent("onclick ",function(){ alert("p点击了"); }); Jetbrains全家桶1年46,售后保障稳定 addEventListener绑定事件,但是只在ie 9以上版本才有用 ,以下版本不可用,ie9以下版本用attachEvent: 1)addEventListener有三个参数,第一个为type,代表事件名称,第二个为handler,为事件处理甘薯,第三个为capture 2)attachEvent只有两个参数,第一个为“on”+type,即第一点中addEventListener第一个参数为click,则attachEvent的参数为onclick加上on,第二个参数为
2核2G云服务器首年95元,GPU云服务器低至9.93元/天,还有更多云产品低至0.1折…
addEventListener() 方法,事件监听 你可以使用 removeEventListener() 方法来移除事件的监听。 语法 element.addEventListener(event, function, useCapture); 第一个参数是事件的类型 (如 “click” 或 “mousedown”). 你可以使用函数名,来引用外部函数: element.addEventListener("click", function(){ alert("Hello World!") ; }); element.addEventListener("click", myFunction); function myFunction() { alert ("Hello World addEventListener() 方法可以指定 “useCapture” 参数来设置传递类型: addEventListener( event, function, useCapture
这次做项目遇到了这个问题,本来习惯性的每次都写的是addEventListener绑定click事件。 但是当用addEventListener绑定了多次click事件的时候,引发了我的思考,这两者有区别吗? 具体的事件分析可查看另一篇文章 结论: 1.onclick事件在同一时间只能指向唯一对象 2.addEventListener给一个事件注册多个listener 3.addEventListener对任何 addEventlistener绑定click事件: currentTarget.addEventListener(type, listener, option) 同样上面的DOM结构,对应的javascript 3.addEventListener对任何DOM都是有效的,而onclick仅限于HTML 4.addEventListener可以控制listener的触发阶段,(捕获/冒泡)。
转载 白杨-M http://www.cnblogs.com/baiyangyuanzi/p/6627401.html addEventListener() 方法,事件监听 你可以使用 removeEventListener 语法 element.addEventListener(event, function, useCapture); 第一个参数是事件的类型 (如 "click" 或 "mousedown"). 你可以使用函数名,来引用外部函数: element.addEventListener("click", function(){ alert("Hello World!") ; }); element.addEventListener("click", myFunction); function myFunction() { alert ("Hello World addEventListener() 方法可以指定 "useCapture" 参数来设置传递类型: addEventListener(event, function, useCapture); 默认值为
一般来说,可以直接封装成这种形式: var addEvent = function(element,type,handler){ if(element.addEventListener ){ //DOM2级 element.addEventListener(type,handler,false); //false为冒泡,true为捕获 的使用方式:主要是DOM2级 target.addEventListener(type, listener, useCapture); target就是要注册事件的对象 type就是事件类型 比如“click var btn1Obj = document.getElementByIdx("btn1"); //element.addEventListener(type,listener,useCapture) ; btn1Obj.addEventListener("click",method1,false); btn1Obj.addEventListener("click",method2,false); btn1Obj.addEventListener
background: black; } </style> </head> <body> <script type="text/javascript"> /*addEventListener ("load",function() { alert(1); },false); addEventListener("load",function() { alert */ /*function show() { alert(1); div1.removeEventListener("click",show); } div1.addEventListener
Mozilla中: addEventListener的使用方式: target.addEventListener(type, listener, useCapture); target: 文档节点 ; btn1Obj.addEventListener("click",method1,false); btn1Obj.addEventListener("click",method2,false); ) if (typeof window.addEventListener ! ”,rollover) } 上述的 typeof window.addEventListener ! = “undefined” 程序代码可以判断使用者的浏览器是否支持AddEventListener这个事件模型, 如果不支持就使用attachEvent.
在元素上写事件和addEventListener()的区别 onclick添加事件不能绑定多个事件,后面绑定的会覆盖前面的。而addEventListener能添加多个事件绑定,按顺序执行。 onclick只能冒泡,addEventListener()可以得到捕获or冒泡。 addEventListener方式,不支持低版本的IE。(attachEvent 支持IE)。 addEventListener绑定后则可以用 removeEvenListener 取消。 addEventListener 是W3C DOM 规范中提供的注册事件监听器的方法。 addEventListener用法: 语法: element.addEventListener( type , listener , useCapture ) – – 添加事件监听 – – type addEventListener兼容写法: IE9之前浏览器使用element.attachEvent(type, callback) attachEvent(type, callback) type:
另有js事件详解 点击打开链接 一.addEventListener()和removeEventListener()讲解 addEventListener()与removeEventListener 这也意味着通过addEventListener()添加的匿名函数无法移除 错误用法示例: document.body.addEventListener('touchmove', function 虽然调用removeEventListener(0是看似使用了相同的参数,但实际上,第二个参数与传入addEventListener()中的那一个完全不同的函数。 ('touchmove',bodyScroll,false); 重写后的这个例子在addEventListener()和removeEventListener()中用的是相同的函数。 ");},false); inner.addEventListener('click',function(){alert("我是最里面的");},true); </script> addEventListener
js-addEventListener()第三个参数useCapture 概述: 第3个参数叫做useCapture,是一个boolean值,就是true or false 。 document.getElementById('div2' ), oDvi3 = document.getElementById('div3' ); // 123- > 456- > 345 oDvi1.addEventListener ('click',xx1,true ); oDvi2.addEventListener( 'click',xx2,false ); oDvi3.addEventListener( 'click',xx3
在 window 上添加 addEventListener('error') 事件 同样会阻止默认事件处理函数的执行,即该错误代码的下一行不会执行; 监听 js 运行时错误事件,会比window.onerror 但可以全局捕获资源加载异常的错误; 控制台会通过 console.error 方式打印出错误信息; 事件回调函数传参只有一个保存所有错误信息的参数,如下: // 可以捕获资源加载异常 window.addEventListener
结论 element.addEventListener(event, function[, useCapture]) event:事件名称,如click function:指定要事件触发时执行的函数,可以传入事件参数 id="cc">cc
addEventListener() 是 W3C DOM 规范中提供的注册事件监听器的方法。 优点: 允许给一个事件注册多个监听器 例子: addEventListener: const btn = document.getElementById("btn"); btn.addEventListener const btn = document.getElementById("btn"); btn.addEventListener("click", fn) btn.addEventListener (1), true); document.body.addEventListener("click", () => alert(2), true); document.documentElement.addEventListener document.documentElement.addEventListener("mouseleave", () => alert(3)); document.addEventListener
addEventListener() 方法 实例 在用户点击按钮时触发监听事件: document.getElementById("myBtn").addEventListener("click", displayDate ); addEventListener() 方法用于向指定元素添加事件句柄。 addEventListener() 方法可以更简单的控制事件(冒泡与捕获)。 ; } 向同一个元素中添加多个事件句柄 addEventListener() 方法允许向同一个元素添加多个事件,且不会覆盖已存在的事件: 实例 element.addEventListener("click addEventListener() 方法可以指定 "useCapture" 参数来设置传递类型: addEventListener(event, function, useCapture); 默认值为
("click", myfun) document.getElementById('demo').addEventListener("click", myfun1) function ') } </script> 注意: 1.这里有一个细节,addEventListener()里面有两个参数,第一个表示触发的条件,第二个表示触发的事件 正常情况下,第二个参数直接写函数名并且不加参数 -- js --> <script> document.getElementById('demo').addEventListener("mousemove", myfun) function ('click',function(){alert("我是最外面的");},false); middle.addEventListener('click',function(){alert ('click',function(){alert("我是最外面的");},true); middle.addEventListener('click',function(){alert(
此时,就需要使用addEventListener的方式来添加事件。 ("input")[0]; bt.addEventListener("click", function(){ alert(1) }) bt.addEventListener("click", ) c.addEventListener("click", function(){ alert("b-c") },true) // 冒泡 a.addEventListener("click", function (){ alert("m-a") },false) b.addEventListener("click", function(){ alert("m-b") },false) c.addEventListener 即冒泡 c.addEventListener("click", function(){ alert("b-c") },true) // 冒泡 a.addEventListener("click"
box.addEventListener('click',function(){ console.log('box in 冒泡') },false) container.addEventListener 3.2 addEventListener使用 addEventListener有三个参数 事件类型 事件处理方法 布尔参数,如果是true表示在捕获阶段调用事件处理程序,如果是false,则是在事件冒泡阶段处理 ,一个是对属性赋值,另外一个addEventListener是执行一个函数,可以多次执行 ? 如果该属性为false,div.addEventListener方法在冒泡阶段监听不会触发。 只能写成div.addEventListener('click', callback, true)在“捕获阶段”监听这个事件。
一、addEventListener()方法 addEventListener()方法将事件处理程序附加到指定的元素。 可以重写随机颜色,如下所示: 例: <! 将addEventListener()方法附加到按钮上。addEventListener()接受两个必填参数-要监听的事件和监听器回调函数。 1. 将事件监听添加到Window对象 此外,可以addEventListener()在文档和窗口对象上使用。 本示例使用以下addEventListener()方法将click事件附加到文档: document.addEventListener("click", function() { alert("Hello ; }); 使用该addEventListener()方法将调整大小(resize)事件附加到窗口: window.addEventListener("resize", function() { box.innerHTML
Flash中只有影片MovieClip(准确的讲是Sprite)可以调用startDrag,endDrag,创建对象拖动最简单的办法只要调用这二个方法即可 myobj.addEventListener( MouseEvent.MOUSE_DOWN,pickup); myobj.addEventListener(MouseEvent.MOUSE_UP,place); function pickup(e: (MouseEvent.MOUSE_DOWN,MouseDownHandler); R1.addEventListener(MouseEvent.MOUSE_UP,MouseUpHandler); R2 .addEventListener(MouseEvent.MOUSE_DOWN,MouseDownHandler); R2.addEventListener(MouseEvent.MOUSE_UP,MouseUpHandler ); R3.addEventListener(MouseEvent.MOUSE_DOWN,MouseDownHandler); R3.addEventListener(MouseEvent.MOUSE_UP
扫码关注腾讯云开发者
领取腾讯云代金券