首页 技术 正文
技术 2022年11月15日
0 收藏 427 点赞 3,441 浏览 2561 个字

<!–
.Abstract {
padding: 15px;
border: dotted 2px #999;
color: #999;
font-family: ‘Microsoft Yahei’;
border-radius: 4px;
}
.First {
margin: 10px 0;
font-family: ‘Microsoft Yahei’;
text-align: left;
padding: 6px 20px;
color: #fff;
background: #55895B;
font-size: 20px;
border-radius: 4px;
clear: both;
}
.Second {
margin: 10px 0;
font-family: ‘Microsoft Yahei’;
padding: 6px 20px;
background: #93C8A2;
color: white;
font-size: 18px;
border-radius: 4px;
clear: both;
}
.Third {
margin: 10px 0;
padding: 6px 20px;
font-family: ‘Microsoft Yahei’;
margin: 15px 0;
font-size: 16px;
color: black;
background: #C6EFD2;
border-radius: 4px;
clear: both;
}
.note {
margin: 10px 0;
padding: 15px 20px 15px 60px;
background: #FCFAA9 url(‘https://img.zhankr.net/m1tmarze502167687.png’) no-repeat 20px 0;
font-size: 15px;
font-family: ‘Microsoft Yahei’;
box-shadow: 0 0 8px #aaa;
clear: both;
}
.demo {
text-align: left;
padding: 6px 20px;
overflow: auto;
border-radius: 4px;
background: orange;
color: #fff;
font-size: 16px;
clear: both;
}
.cnblogs_Highlighter {
border: solid 1px #ccc;
clear: both;
}
.cnblogs_code {
background: #EFFFF4;
border: solid 0px #939393;
font-size: 14px;
clear: both;
padding: 10px 20px;
}
.cnblogs_code pre {
font-size: 14px;
}
.cnblogs_code span {
font-family: Courier New;
font-size: 14px;
}
–>

原文出处:  http://www.w3cfuns.com/notes/11861/e21736a0b15bceca0dc7f76d77c2fb5a.html 。 我拿出作者中的一段,感谢作者原创。

DOM中的事件模拟(自定义事件):

  DOM3级还定义了自定义事件,自定义事件不是由DOM原生触发的,它的目的是让开发人员创建自己的事件。要创建的自定义事件可以由createEvent(“CustomEvent”); 返回的对象有一个initCustomEvent()方法接收如下四个参数。
  1)type:字符串,触发的事件类型,自定义。例如 “keyDown”,“selectedChange”;
  2)bubble(布尔值):标示事件是否应该冒泡;
  3)cancelable(布尔值):标示事件是否可以取消;
  4)detail(对象):任意值,保存在event对象的detail属性中;

可以像分配其他事件一样在DOM中分派创建的自定义事件对象。如:

  var  div = document.getElementById(“myDiv”);
  EventUtil.addEventHandler(div,”myEvent”, function () {
    alert(“div myEvent!”);
  });
  EventUtil.addEventHandler(document,”myEvent”,function(){
    alert(“document myEvent!”);
  });
  if(document.implementation.hasFeature(“CustomEvents”,”3.0″)){
    var e = document.createEvent(“CustomEvent”);
    e.initCustomEvent(“myEvent”,true,false,”hello world!”);
    div.dispatchEvent(e);
  }
  这个例子中创建了一个冒泡事件“myEvent”。而event.detail的值被设置成了一个简单的字符串,然后在div和document上侦听该事件,因为在initCustomEvent中设置了事件冒泡。所以当div激发该事件时,浏览器会将该事件冒泡到document。
  IE中的事件模拟(IE8及之前版本中):
  与DOM中事件模拟的思路类似,先创建event对象,再为其指定相应信息,然后再使用该对象来触发事件。当然IE在实现以下每个步骤都不太一样。
  例如:
  var btn = document.getElementById(“myBtn”);
  //创建事件对象,不接受任何参数,结果会返回一个通用的event对象,你必须为该event对象指定所有必要的信息。
  var event  = document.createEventObject();
  //初始化事件对象
  event.screenX = 100;
  event.screenY = 0;
  event.clientX = 0;
  event.clientY =0;
  event.ctrlKey = false;
  event.altKey = false;
  event.shiftKey = false;
  event.button = 0;

  //触发事件
  btn.fireEvent(“onclick”,event);

相关推荐
python开发_常用的python模块及安装方法
adodb:我们领导推荐的数据库连接组件bsddb3:BerkeleyDB的连接组件Cheetah-1.0:我比较喜欢这个版本的cheeta…
日期:2022-11-24 点赞:878 阅读:9,497
Educational Codeforces Round 11 C. Hard Process 二分
C. Hard Process题目连接:http://www.codeforces.com/contest/660/problem/CDes…
日期:2022-11-24 点赞:807 阅读:5,910
下载Ubuntn 17.04 内核源代码
zengkefu@server1:/usr/src$ uname -aLinux server1 4.10.0-19-generic #21…
日期:2022-11-24 点赞:569 阅读:6,744
可用Active Desktop Calendar V7.86 注册码序列号
可用Active Desktop Calendar V7.86 注册码序列号Name: www.greendown.cn Code: &nb…
日期:2022-11-24 点赞:733 阅读:6,498
Android调用系统相机、自定义相机、处理大图片
Android调用系统相机和自定义相机实例本博文主要是介绍了android上使用相机进行拍照并显示的两种方式,并且由于涉及到要把拍到的照片显…
日期:2022-11-24 点赞:512 阅读:8,135
Struts的使用
一、Struts2的获取  Struts的官方网站为:http://struts.apache.org/  下载完Struts2的jar包,…
日期:2022-11-24 点赞:671 阅读:5,300