用js封装的处理一些事件的方法

	//声明一个对象
			var eventUtil={
				//添加句柄
				addHandler:function(element,type,handler){
					//DOM2级事件处理判断
					if(element.addEventListener){
						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){
					//DOM2级事件处理判断
					if(element.removeEventListener){
						elememt.removeEventListener(type,handler,false);
					}else if(element.detachEvent){//IE事件处理判断
						element.detachEvent(‘on‘+type,handler);
					}else{//DOM0级事件判断
						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.cancelButtle=true;
					}
				}
			}

  

时间: 2024-11-05 10:17:29

用js封装的处理一些事件的方法的相关文章

vue学习如何引入js,封装操作localStorage本地储存的方法

// 封装操作localStorage本地储存的方法 模块化的文件 //nodejs 基础 var storage={ set(key,value){ localStorage.setItem(key,JSON.stringify(value)); }, get(key){ return JSON.parse(localStorage.getItem(key)); }, remove(key){ localStorage.removeItem(key); } } export default s

关于js封装框架类库之事件模块

在触发DOM上的某个事件时,会产生一个事件对象event.这个对象中包含着所有与事件有关的信息.包括导致事件的元素,事件的类型以及其他与特定事件相关的信息. 例如: 鼠标操作点击事件时,事件对象中会获得鼠标的按键信息等,会提示按的哪一个键 获得鼠标按键属性button和which 鼠标左中右按键分别对应:在谷歌浏览器中   button:左键 0 右键 2 中键 1  ,which:左键 1 右键 3 中键 2 ie8及以下:左键 1 右键 2 中键 4,which属性不存在 用户在操作键盘时,

原生JS封装AJAX

今天我们来说说利用原生JS封装AJAX. jquery框架的AJAX方法确实很好用,但有时候我们写的页面需要引入多个JS插件,不一定哪个插件就会和jquery发生冲突,导致jquery用不了了.或者页面比较简单,不需要加重浏览器的负担,这时我们自己封装一个AJAX就是一个很好的办法. //将数据转换成 a=1&b=2格式;function json2url(json){   var arr = [];   //加随机数防止缓存;   json.t = Math.random();   for(v

城市三级联动 AJAX-原生js封装

话不多说我们先来一张效果图给大家看一下: html代码如下: <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>城市三级联动 - citys-原生js封装</title> <link rel="shortcut icon" href="../public/image/favi

js封装好的模仿qq消息弹窗代码

在我们的日常开发中,或者生活中,经常需要用到弹出窗.这里我们就用js模拟一下qq消息一样的弹出窗. 直接贴代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml&

原生Js封装的弹出框

<!DOCTYPE HTML> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>原生Js封装的弹出框-弹出窗口-页面居中-多状态可选</title> <style type="text/css"&

原生js封装ajax:传json,str,excel文件上传表单提交

由于项目中需要在提交ajax前设置header信息,jquery的ajax实现不了,我们自己封装几个常用的ajax方法. jQuery的ajax普通封装 var ajaxFn = function(uri, data, cb) { $.ajax({ url: uri, type: 'POST', dataType: 'json', data: data, }) .done(cb) .fail(function() { console.log("error"); }) .always(f

Echarts生成饼状图、条形图以及线形图 JS封装

1.在我们开发程序中,经常会用到生成一些报表,比方说饼状图,条形图,折线图等.不多说了,直接上封装好的代码,如下Echarts.js所示 以下代码是封装在Echarts.js文件中 /** * Created by Administrator on 2015/8/7. */ var charec; // 路径配置 require.config({ paths: { echarts: 'http://echarts.baidu.com/build/dist' } }); // 按需加载所需图表 r

js jquery插入元素后事件会被注销

  js jquery插入元素后事件会被注销 document.body.innerHTML += <div id="dd">test</div>  //这个会注销事件 $(document.body).append(str);//使用这个 也可以绑定事件. 例子: //快捷键双击 $(".app_shortcut_item").dblclick(function () { var id = $(this).attr("id&quo