zoukankan      html  css  js  c++  java
  • javascript 事件处理

    js事件处理的方式有三种:

    1.HTML事件处理

    <input type="button" value="click me" onclick="alert("Clicked");"/>

    2.DOM0级事件处理

    var btn = document.getElementById("myBtn");
    btn.onclick = function(){
      alert("Clicked");  
    }

    3.DOM2级事件处理

    var btn=document.getElementById("myBtn");
    btn.addEventListener("click",function()){
        alert(this.id);
    },false);
    //false 表示在冒泡阶段调用时间处理函数,如果是true,表示在捕获阶段调用事件处理程序。

    4.IE事件处理

    IE8及IE8以前的版本只支持事件冒泡。

    var btn=document.getElementById("myBtn");
    btn.attachEvent("onclick",function()){
        alert(this === windown); //true 跨浏览器编程时,要牢记这一区别。
    },false);

    5.跨浏览器的事件处理

    var EventUtil = {
        addHandle:function(element, type, handler){
            if(element.addEventListener){
                element.addEventListener(type, handler, false);
            }else if(element.attachEvent){
                element.attachEvent("on"+type, handler);
            }else{
                element["on"+type] = handler;
            }
        },
        removeHandle:  function(element, type, handler){
            if(element.removeEventListener){
                element.removeEventListener(type, handler, false);
            }else if(element.detachEvent){
                element.detachEvent("on"+type, handler);
            }else{
                element["on"+type] = null;
            }
        }
    }
  • 相关阅读:
    atom那些事儿
    浙江省和杭州市
    Web API之indexedDB和Web SQL
    绝对定位元素居中
    多列等高布局
    git生成ssh key及github ssh key对接
    vuejs模板使用方法
    css3动画图片波纹效果
    sticky footer布局,定位底部footer
    css3圆环闪烁动画
  • 原文地址:https://www.cnblogs.com/zhutianpeng/p/4216504.html
Copyright © 2011-2022 走看看