浏览器兼容——DOM事件封装函数
//封装函数
var eventUtil={
//添加事件
addHandler:function(element,type,handler){
if(element.addEventListener){ //如果支持DOM2
element.addEventListener(type,handler,false);
}else if(element.attachEvent){ //如果支持IE
element.attachEvent('on'+type,handler);
}else{ //DOM0级
element['on'+type]=handler;
}
}
//删除事件
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;
}
}
//获得事件
getEvent:function (event) {
return event?event:window.event;
}
getType:function (event) {
return event.type;
}
//获取事件目标
getElement:function (event) {
return event.target||event.srcElement;
}
//阻止默认行为
preventDefault:function (event) {
if(event.preventDefault){
event.preventDefault();
}else{
event.returnValue=false;
}
}
//阻止冒泡
stopPropagation:function (event) {
if (event.stopPropagation) {
event.stopPropagation();
} else {
event.cancelBubble=true;
}
}
浏览器兼容——DOM事件封装函数的更多相关文章
- Example010实现浏览器兼容改内容的函数,自写
<!-- 实例010实现浏览器兼容改内容的函数 --> <!DOCTYPE html> <html lang="en"> <head> ...
- JavaScript中DOM查询封装函数
在JavaScript中可以通过BOM查询html文档中的元素,也就是所谓的在html中获取对象然后对它添加一个函数. 常用的方法有以下几种: ①document.getElementById() 通 ...
- js中浏览器兼容startsWith 、endsWith 函数
在做js开发的时候用到了startsWith函数时,发现各个浏览器不兼容问题,因为对开发来说,chrome浏览器最好用,就一直在chrome浏览器中使用这两个函数没有任何问题,但在ie浏览器访问就直接 ...
- DOM事件-调用函数
通过调用函数改变其内容: <!DOCTYPE html> <html lang="en" dir="ltr"> <head> ...
- 关于UC浏览器兼容scroll事件问题
经过本人查阅无数资料,最终得出一个比较简单,具有一定兼容性的结果. $(window).scroll(function( ) { var scrollTop = document.documentEl ...
- JS+Zero Clipboard swf复制到剪贴板 兼容浏览器(bind事件绑定函数)
转自http://www.ipmtea.net/css_ie_firefox/201107/07_499.html 1.ZeroClipboard其实是国外的一个js类库,源码结构如: var Zer ...
- 兼容IE9以下和非IE浏览器的原生js事件绑定函数
事件绑定函数的demo如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "htt ...
- 跨浏览器的javascript事件的封装
一,跨浏览器的事件处理程序 1,DOM0级处理事件 将一个函数赋值给一个事件处理程序属性. 事件流:冒泡阶段. 使用: 为元素增加事件: var btn = document.getElementBy ...
- 如何优雅的封装一个DOM事件库
1.DOM0级事件和DOM2级事件 DOM 0级事件是元素内的一个私有属性:div.onclick = function () {},对一个私有属性赋值(在该事件上绑定一个方法).由此可知DOM 0级 ...
随机推荐
- js写的简单轮播图
这个轮播图代码是从网上找来的,专门找了个写法简单的,只是作为一个小练习,大概原理如下: 1.首先是图片切换2.自动播放3.调用自动播放4.移动到容器上边停止播放,离开自动播放5.移动到导航上停止播放, ...
- JAVA和.NET互调用
通过接口实现JAVA和.NET互调用-JNInterface 使用C#编程多年,也十分感激微软在语言架构.语法糖.编辑器等方面给自己带来的便利.但因为最近工作中有接触到JAVA,渐渐地发现的确像大家说 ...
- 转: when.js原理和核心实现
这篇文章可以看作是屈屈同学关于when.js的文章<异步编程:When.js快速上手>的续篇. 屈屈的文章中详细介绍了when.js,在这里关于when.js的使用我就不多复述了,大家可以 ...
- Web平台开发流程以及规范
1.js和css的放的位置顺序与加载速度分析 为了让客户先看到效果,必须要先加CSS 如果在先head加载CSS,如果CSS大,会先下载CSS,再渲染HTML标签 如果CSS放在head中,当显示出H ...
- Android发展简单介绍
Android一词的本义指“机器人”,同一时候也是Google于2007年11月5日宣布的基于Linux平台的开源手机操作系统的名称,该平台由操作系统.中间件.用户界面和应用软件组成,号称是首个为移动 ...
- Easyui登陆页面制作
一.登陆页面HTML <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Web ...
- JS提取URL中的参数
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> ...
- SqlCacheDependency的使用
最近项目需要几秒就获取一次数据,查数据库服务器压力会很大,因此用缓存技术来缓解服务器压力. 使用SqlCacheDependency采用轮询的方式来获取缓存,SqlDependency查询通知的方式来 ...
- N个任务掌握java系列之统计一篇文章中单词出现的次数
问题:统计一篇文章中单词出现的次数 思路: (1)将文章(一个字符串存储)按空格进行拆分(split)后,存储到一个字符串(单词)数组中. (2)定义一个Map,key是字符串类型,保存单词:valu ...
- jsp中的两种跳转方式分别是?有什么区别?
在JSP中跳转有两种方式 forward跳转:<jsp:forward page ="跳转页面地址"> response跳转:response.sendRedirect ...