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. Gora官方文档之二:Gora对Map-Reduce的支持

    参考官方文档:http://gora.apache.org/current/tutorial.html 项目代码见:https://code.csdn.net/jediael_lu/mygoradem ...

  2. dedecms likearticle 调用附加表的字段调用方式

    [field:id runphp='yes'] $aid = @me; $row = $GLOBALS['dsql']->GetOne("Select 字段名 From `dede_a ...

  3. PHP 中数组函数 isset 效率比 array_key_exists 更高

    PHP 中数组函数 isset 效率比 array_key_exists 更高 PHP 浏览:4194 2014年04月05日 isset 和 array_key_exists 函数都可以用来测试数组 ...

  4. python time模块函数

    # -*-coding=utf-8 -*- __author__ = 'piay' import time def get_struct_time(): ''' 可以使用list或者字符串格式化 tm ...

  5. Scala学习笔记--xml

    http://blog.csdn.net/beautygao/article/details/38497065 https://github.com/scala/scala-xml http://st ...

  6. Linux下安装并启动MongDB

    1.下载MongoDB 下载链接: http://www.mongodb.org/downloads 2.解压下载的压缩包 tar -zxvf mongodb-linux-x86_64-3.2.8.t ...

  7. [POJ] 2453 An Easy Problem [位运算]

    An Easy Problem   Description As we known, data stored in the computers is in binary form. The probl ...

  8. java.lang.NoClassDefFoundError: org/apache/commons/lang/StringUtils

    java.lang.NoClassDefFoundError: org/apache/commons/lang/StringUtils Caused by: java.lang.ClassNotFou ...

  9. Gson解析复杂JSON对象

    例如以下格式JSON: 建立对应的Java对象,注意内部类要定义成静态的 public class HResult { public String total; public String recor ...

  10. 2013第46周四xml作为WS两端中间测试文件

    今天又到了11点多才开始写随笔记录,有点惭愧,加班回来到现在已经近2小时了,而我此刻才进入正题,之前的时间都跟MM聊天了,或许是单身久了,居然在个人情感方面感觉自己很out了,不想这些了,重点是回顾下 ...