js 事件小结
1,事件对象
e || window.event //ie
2, 取鼠标点击坐标 带有滚动条的
var top = document.documentElement.scrollTop || document.body.scrollTop;//chorme
var x = top + e.clientX; //可视区坐标
3, 获取屏幕坐标
e.screenX e.screenY
4, shiftKey altKey ctrlkey
5,onkeydown/onkeyup keyCode 返回的是ASCII码 不区分大小写
6,onkeypress
ff 返回keycode 所有的字符都返回0
chorom/ie 返回keycode 支持大小写
charCode 返回字符编码
7, 获取事件源
target = e.target || e.srcElement
target.tagName
e.type
8, 事件流
ff 先捕获然后再冒泡
ie 冒泡
9, 取消冒泡
e.stopPropagation() || e.cancelBubble = true;
10, addEventListener
1,解决调用两次,不会被覆盖 (ie倒着弹出)
window.addEventListener('load',function(){
alert('lv');
},false);
window.addEventListener('load',function(){
alert('Miss.lv');
},false);
ff lv Miss.lv
ie Miss.lv lv
2,解决传递两个相同的函数,只执行一次(ie没有解决,传递相同的两个函数)
window.addEventListener('load',init,false);
window.addEventListener('load',init,false);
3,this指向 (ie this 指向window)
window.attachEvent('load',function(){
var box = document.getElementById('box');
box.attachEvent('onclick',function(){
alert(this===window); //true
})
})
function addEvent(obj,type, fn){
obj.attachEvent('on'+type, function(){
fn.call(obj,arguments);
})
}
addEvent(window,'load',function(){
var box = document.getElementById('box');
addEvent(box,'click',function(){
alert(this === box);
})
})
4,添加一个额外的方法,不会不覆盖
11, 移入 e.ralatedTarget e.fromElement mouseover
移出 e.ralatedTarget e.toElement mouseout
12, 阻止默认行为
e.preventDefault();
e.returnValue = false;
不能直接用return false;因为return false只能放到前面,后面的就不能执行了
13, 滚轮事件
非 ff mousewheel
ff DOMMouseScroll
wD : function(e){
var e = this.getEvent(e);
if(e.wheelDelta){
return e.wheelDelta;
}else{
return -e.detail*40;
}
}
js 事件小结的更多相关文章
- js事件小结
首先事件绑定分为2种方法 一种为"DOM0级"方法,这里我理解为事件指定 var oDiv = document.getElementById("div1"); ...
- 深入浅出js事件
深入浅出js事件 一.事件流 事件冒泡和事件捕获分别由微软和网景公司提出,这两个概念是为了解决页面中事件流(事件发生顺序)的问题. <div id="outer"> & ...
- 一文梳理JS事件
JavaScript与HTML的交互是通过事件进行的.事件,就是文档或浏览器窗口发生的一些特定的交互瞬间. 事件流 事件捕获 事件冒泡 事件处理程序 事件委托 1. 事件流 如果单机页面上的某个按钮, ...
- dynamic-css 动态 CSS 库,使得你可以借助 MVVM 模式动态生成和更新 css,从 js 事件和 css 选择器的苦海中脱离出来
dynamic-css 使得你可以借助 MVVM 模式动态生成和更新 css,从而将本插件到来之前,打散.嵌套在 js 中的修改样式的代码剥离出来.比如你要做元素跟随鼠标移动,或者根据滚动条位置的变化 ...
- 什么是JS事件冒泡?
什么是JS事件冒泡?: 在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理 程序或者事件返回true,那么 ...
- js事件技巧方法整合
window.resizeTo(800,600); //js设置浏览器窗口尺寸 window.open (function(){ resizeTo(640,480);//设置浏览器窗口尺寸 moveT ...
- js事件浅析
js中关于DOM的操作很多,因此js事件机制也就尤为重要. 事件绑定形式: 一. 内联形式 耦合度高,不利于维护 <button onclick="alert('你点击了这个按钮'); ...
- js 事件大全
Js事件大全一般事件 事件 浏览器支持 描述onClick IE3|N2|O3 鼠标点击事件,多用在某个对象控制的范围内的鼠标点击onDblClick IE4|N4|O 鼠标双击事件onMouseDo ...
- 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别
一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...
随机推荐
- Ajax调用asp.net后台代码
后台代码: [WebMethod] public static string CreateDate(string name,string age) { return "姓名:"+n ...
- linux 安装中文支持包及中文字符集配置
由于某些原因系统安装时未安装中文支持,导致后续应用出现中文方块乱码现象,解决方法很简单,当然不是重装,只需以下三步即可搞定. 1.安装中文包: #yum -y groupinstall chinese ...
- 如何让你的 footer 总是在浏览器底部无论什么分辨率无论什么浏览器?
一个可以用的CSS驱动的可粘在底部的Footer 我们曾经都或多或少的试过用CSS来把Footer固定在底部的经理,但是他们总是不能正常的粘在底部,不是吗?可喜的是,痛苦的研究如何让footer粘在底 ...
- hadoop集群之HDFS和YARN启动和停止命令
假如我们只有3台linux虚拟机,主机名分别为hadoop01.hadoop02和hadoop03,在这3台机器上,hadoop集群的部署情况如下: hadoop01:1个namenode,1个dat ...
- BZOJ 1264 基因匹配Match(LCS转化LIS)
题目链接:http://61.187.179.132/JudgeOnline/problem.php?id=1264 题意:给出两个数列,每个数列的长度为5n,其中1-n每个数字各出现5次.求两个数列 ...
- 从头到尾彻底理解KMP(2014年8月22日版)
http://blog.csdn.net/v_july_v/article/details/7041827
- 《Programming WPF》翻译 第3章 4.我们进行到哪里了?
原文:<Programming WPF>翻译 第3章 4.我们进行到哪里了? 控件是由应用程序创建的块.它们描述了用户用来交互的界面特征.控件提供了行为,依赖样式和模板来表示一个外观.输入 ...
- UML--一些图
通过UML来表示汽车,简洁明了. 统一建模语言--UML. 参与者Actor,参与者代表了现实世界的人.人. 用例use case,就是参与者要做什么并且获得什么.事. 业务场景,用例场景.规则. 业 ...
- 【转】树莓派学习笔记——I2C Tools 学习笔记
原文网址:http://blog.csdn.net/xukai871105/article/details/15029843 1.安装 I2C驱动载入和速率修改请查看博文[树莓派学习笔记——I ...
- HDU 1251 字典树(前缀树)
题目大意 :Ignatius最近遇到一个难题,老师交给他很多单词(只有小写字母组成,不会有重复的单词出现),现在老师要他统计出以某个字符串为前缀的单词数量(单词本身也是自己的前缀).(单词互不相同) ...