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 事件小结的更多相关文章

  1. js事件小结

    首先事件绑定分为2种方法 一种为"DOM0级"方法,这里我理解为事件指定 var oDiv = document.getElementById("div1"); ...

  2. 深入浅出js事件

    深入浅出js事件 一.事件流 事件冒泡和事件捕获分别由微软和网景公司提出,这两个概念是为了解决页面中事件流(事件发生顺序)的问题. <div id="outer"> & ...

  3. 一文梳理JS事件

    JavaScript与HTML的交互是通过事件进行的.事件,就是文档或浏览器窗口发生的一些特定的交互瞬间. 事件流 事件捕获 事件冒泡 事件处理程序 事件委托 1. 事件流 如果单机页面上的某个按钮, ...

  4. dynamic-css 动态 CSS 库,使得你可以借助 MVVM 模式动态生成和更新 css,从 js 事件和 css 选择器的苦海中脱离出来

    dynamic-css 使得你可以借助 MVVM 模式动态生成和更新 css,从而将本插件到来之前,打散.嵌套在 js 中的修改样式的代码剥离出来.比如你要做元素跟随鼠标移动,或者根据滚动条位置的变化 ...

  5. 什么是JS事件冒泡?

    什么是JS事件冒泡?: 在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理 程序或者事件返回true,那么 ...

  6. js事件技巧方法整合

    window.resizeTo(800,600); //js设置浏览器窗口尺寸 window.open (function(){ resizeTo(640,480);//设置浏览器窗口尺寸 moveT ...

  7. js事件浅析

    js中关于DOM的操作很多,因此js事件机制也就尤为重要. 事件绑定形式: 一. 内联形式 耦合度高,不利于维护 <button onclick="alert('你点击了这个按钮'); ...

  8. js 事件大全

    Js事件大全一般事件 事件 浏览器支持 描述onClick IE3|N2|O3 鼠标点击事件,多用在某个对象控制的范围内的鼠标点击onDblClick IE4|N4|O 鼠标双击事件onMouseDo ...

  9. 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别

    一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...

随机推荐

  1. slf4j教程

    slf4j只是一个门面(facet),它不包含具体的实现,而是将一些log4j,java.logging等实现包装成统一的接口.借用下图展示了常用日志文件的关系: 通过上面的图,可以简单的理清关系! ...

  2. PHP第三节笔记

    ●为什么要安装web服务器,和怎么样去了解发送和接受到什么? 1.因为我们的浏览器要取数据,数据是从服务器取出来的. 2.我们可以通过httpwatch工具来获取发送和接收的数据,有利于我们了解的更加 ...

  3. pubwin 客户端会员无法自助结账的排查方法

    客户端会员无法自助结账按以下方法排查:1,看客户端能不能打开web https 后台,打不开的话,在服务端打上2048证书补丁(按下面帖子操作)http://bbs.pubwin.com.cn/for ...

  4. JDK Linux环境配置

    ① $sudo vi /etc/profile ② 在末尾行添加 #set java environment JAVA_HOME=/usr/local/jdk1.7.0 CLASSPATH=.:$JA ...

  5. 开心菜鸟学习系列-----javascript(2)

    最小全局变量 :        1)每个javascript环境有一个全局对象,当你在任意的函数外面使用this的时候可以访问到,你创建的每一个全部变量都成了这个全局对象的属性,在浏览器中,方便起见, ...

  6. 遍历ArrayList与LinkedList,使用FOR与迭代器的区别

    网上结论: 如果是链表结构的集合,如LinkedList,则使用迭代器遍历,速度会更快(顺序获取). 如果是数组结构的,如ArrayList,则使用for循环会更快(随机获取) 测试代码: packa ...

  7. Thinkpad E430+CentOS 6.4+ linux-3.10.12内核网卡驱动(无线+有线)配置

    配置并编译安装内核模块和内核后,解压附件 firmware.tar.bz2,拷贝其中的rtlwifi文件夹到/lib/firmware下,然后 执行装载内核模块命令: sudo modprobe rt ...

  8. libeXosip2(2) -- General purpose API.

    General purpose API. general purpose API in libeXosip2-4.0.0. More... Modules eXosip2 configuration ...

  9. Android Studio代码着色插件

    文章将给大家分享Studio中代码高亮插件,个人觉得换个代码着色方式还是挺有必要的,起码让视觉上有个变换,感官上爽一些.就像吃惯了大鱼大肉,偶尔也来点青菜萝卜吧.以下是个人喜欢的几款,给个效果图大家看 ...

  10. Inorder Successor in BST 解答

    Question Given a binary search tree and a node in it, find the in-order successor of that node in th ...