美文网首页
js 中事件绑定

js 中事件绑定

作者: 天外来人 | 来源:发表于2017-02-09 11:06 被阅读31次

    事件绑定

    onclick -->事件冒泡,重写onclick会覆盖之前属性,没有兼容性问题。

    ele.onclick = null; 解绑单击事件,将onclick属性设为null 即可
    

    addEventListener(event.type, handle, boolean) IE8及以下不支持,属于DOM2级的方法,可添加多个方法不被覆盖。

    //事件类型没有on
    //参数boolean: false 表示在事件第三阶段(冒泡)触发, true表示在事件第一个阶段(捕获)触发。
    //如果handle是同一个方法,只执行一次
    ele.addEventListener(event.type, handle, boolean);
    
    //解绑事件, 参数和绑定一样
    ele.removeEventListener(event.type, handle, boolean);
    

    attachEvent(event.type, handle) IE特有,兼容IE8及以下,可添加多个事件处理程序,只支持冒泡阶段。

    //事件类型要加on
    //如果handle是同一个方法,绑定几次执行几次
    ele.attachEvent('onclick', function(){});
    
    //解绑事件,参数和绑定一样
    ele.detachEvent('onclick', function(){});
    

    默认事件行为:href ="" submit表单提交等

    阻止默认事件

    return false 阻止独享属性(通过on这种方式)绑定的事件的默认事件。

    ele.onclick = function(){
      ******
      return false;
    };
    

    event.preventDefault() 阻止通过addEventListener() 添加的事件的默认事件

    ele.addEventListener('click', function(e){
      var event = e || window.event;
    
      event.preventDefault();
    }, false);
    

    event.returnValue = false阻止通过attachEvent() 添加的事件的默认事件

    ele.attachEvent('onclick', function(e){
      var event = e || window.event;
    
      event.returnValue = false;
    }, false);
    

    阻止事件冒泡 事件捕获

    event.stopPropagation(); //阻止事件的进一步传播,包括(冒泡,捕获)
    event.cancelBubble = true; //true 阻止冒泡

    参考文献:http://www.cnblogs.com/zhangmingze/p/4864367.html

    相关文章

      网友评论

          本文标题:js 中事件绑定

          本文链接:https://www.haomeiwen.com/subject/ovriittx.html