-
事件对象 在触发DOM上的事件时都会产生一个对象 事件对象event 1.DOM中的事件对象 a.type属性 用于获取事件类型 b.target属性 用于获取事件目标 c.stopPropagation()方法 用于阻止/取消事件冒泡 d.preventDefault()方法 用于阻止事件的默认行为（如：<a href="#">超链接</a>，a标签有默认的跳转行为）查看全部
-
5.跨浏览器的事件处理程序 恰当使用能力检测，最好封装在一个对象内 var eventUtil={ //添加句柄 addHandler:function(element,type,handler){ if(element.addEventListener){ element.addEventListener(type,handler,false);//DOM2级事件处理程序判断 }else if(element.attachEvent){ element.attachEvent('on'+type,handler);//IE事件处理程序判断 }else{ element['on'+type]=handler;//DOM0级事件处理程序判断 //element.'on'+type不对，不能用'.'；在js中，所有用‘.’连接属性的地方都可改为用‘[]’。如：element.onclick==element['onclick'] } }, //删除句柄 removeHandler:function(element,type,handler){ if(element.removeEventListener){ element.removeEventListener(type,handler,false); }else if(element.detachEvent){ element.detachEvent('on'+type,handler); }else{ element['on'+type]=null; } } } //调用函数 eventUtil.addHandler(btn3,'click',showMes); //删除函数 eventUtil.removeHandler(btn3,'click',showMes);查看全部
-
3.DOM2级事件处理程序 定义了两个方法：用于处理指定和删除事件处理程序的操作 addEventListener()--添加事件监听程序 和removeEventListener()--移除事件监听程序 接收三个参数：要处理的事件名、作为事件处理程序的函数和布尔值（false：表示在冒泡阶段调用事件处理程序(可以最大限度的兼容浏览器)，一般设为false；true表示在捕获阶段调用事件处理程序） 如：<input type="button" value="按钮3" id="btn3"> function showMes(){......;} var btn3=document.getElementById('btn3'); btn3.addEventListener('click',showMes,false);//onclick不加on,用false兼容各种浏览器 btn3.addEventListener('click',function(){ alert(this.value);//this为引用被触发的元素 },false); btn3.removeEventListener('click',showMes,false);//删除事件必需传入与添加事件时相同的参数 注意： 1.若事件名称有on，则需去掉on。onclick --> click，onmouseover --> mouseover等等； 2.false 最大限度兼容所有浏览器--事件冒泡流； 3.通过addEventListener()添加的事件只能通过removeEventListener()来删除。 DOM0级和DOM2级共同优点：可以给一个元素添加多个事件处理程序，这些事件处理程序会按顺序执行。 缺点：DOM2级事件处理程序，ie不支持，ie有专用的事件处理程序。查看全部
-
事件对像！查看全部
-
事件对象 在触发DOM上的事件时都会产生一个对象 事件对象event 1.DOM中的事件对象 a.type属性 用于获取事件类型 b.target属性 用于获取事件目标 c.stopPropagation()方法 用于阻止/取消事件冒泡 d.preventDefault()方法 用于阻止事件的默认行为（如：<a href="#">超链接</a>，a标签有默认的跳转行为）查看全部
-
1.HTML事件处理程序 事件直接加在HTML结构里 如onclick事件写在input按钮里： <input type="button" value="按钮" id="btn" onclick="showMessage()> function showMessage(){ ...... } 缺点：HTML和JS代码紧密的耦合在一起（JS代码和HTML都需要进行修改）查看全部
-
使用事件处理程序 1.HTML事件处理程序 2.DOM0级事件处理程序 3.DOM2级事件处理程序 4.IE事件处理程序 5.跨浏览器的事件处理程序查看全部
-
5.跨浏览器的事件处理程序 恰当使用能力检测，最好封装在一个对象内 var eventUtil={ //添加句柄 addHandler:function(element,type,handler){ if(element.addEventListener){ element.addEventListener(type,handler,false);//DOM2级事件处理程序判断 }else if(element.attachEvent){ element.attachEvent('on'+type,handler);//IE事件处理程序判断 }else{ element['on'+type]=handler;//DOM0级事件处理程序判断 //element.'on'+type不对，不能用'.'；在js中，所有用‘.’连接属性的地方都可改为用‘[]’。如：element.onclick==element['onclick'] } }, //删除句柄 removeHandler:function(element,type,handler){ if(element.removeEventListener){ element.removeEventListener(type,handler,false); }else if(element.detachEvent){ element.detachEvent('on'+type,handler); }else{ element['on'+type]=null; } } } //调用函数 eventUtil.addHandler(btn3,'click',showMes); //删除函数 eventUtil.removeHandler(btn3,'click',showMes);查看全部
-
4.IE事件处理程序 attachEvent()添加事件 detachEvent()删除事件 接收相同的两个参数：事件处理程序的名称和事件处理程序的函数 不使用第三个参数的原因：IE8以及更早的浏览器版本只支持事件冒泡！ 如：<input type="button" value="按钮3" id="btn3"> function showMes(){......;} var btn3=document.getElementById('btn3'); btn3.attachEvent('onclick',showMes); btn3.detachEvent('onclick',showMes); 支持IE事件处理程序的浏览器：IE和OPERA查看全部
-
3.DOM2级事件处理程序 定义了两个方法：用于处理指定和删除事件处理程序的操作 addEventListener()--添加事件监听程序 和removeEventListener()--移除事件监听程序 接收三个参数：要处理的事件名、作为事件处理程序的函数和布尔值（false：表示在冒泡阶段调用事件处理程序(可以最大限度的兼容浏览器)，一般设为false；true表示在捕获阶段调用事件处理程序） 如：<input type="button" value="按钮3" id="btn3"> function showMes(){......;} var btn3=document.getElementById('btn3'); btn3.addEventListener('click',showMes,false);//onclick不加on,用false兼容各种浏览器 btn3.addEventListener('click',function(){ alert(this.value);//this为引用被触发的元素 },false); btn3.removeEventListener('click',showMes,false);//删除事件必需传入与添加事件时相同的参数 注意： 1.若事件名称有on，则需去掉on。onclick --> click，onmouseover --> mouseover等等； 2.false 最大限度兼容所有浏览器--事件冒泡流； 3.通过addEventListener()添加的事件只能通过removeEventListener()来删除。 DOM0级和DOM2级共同优点：可以给一个元素添加多个事件处理程序，这些事件处理程序会按顺序执行。 缺点：DOM2级事件处理程序，ie不支持，ie有专用的事件处理程序。查看全部
-
键盘事件查看全部
-
事件对象截图查看全部
-
好好好查看全部
-
2.DOM0级事件处理程序 较传统的方式：把一个函数赋值给一个事件的处理程序属性 用的比较多的方法，原因：简单，跨浏览器的优势 如：<input type="button" value="按钮2" id="btn2"> var btn2=document.getElementById('btn2'); //取得btn2按钮对象 btn2.onclick=function(){ //btn2.onclick是给btn2添加onclick属性 alert('Hi'); } btn2.onclick=null; //删除onclick属性 没有HTML事件处理程序的缺点查看全部
-
1.window.onload函数缺少个'}' 2.<span>标签中添加个关闭文字就可以关闭了 就像<span>关闭</span>查看全部
举报
0/150
提交
取消