jquery卸载全部事件的思路及实例

作者:袖梨 2022-06-25

原生js不支持匿名卸载事件的,jquery为了开发者好用支持了匿名的

匿名事件的思路

首先她会判断目标是否是元素或者对象,如果是元素,则在元素上打一个标识(expando)然后值是生成的一个guid,并在缓存对象下建立一个缓存,比如:

$.cache={
    '2': {
        data: {},
        events: {},
        handle: function(){}
    },
}



然后会在你触发元素事件时拿元素上的标识去往缓存里的events里找,并会有是否委托,选择器等判断,然后最终触发,卸载的时候其实是拿缓存里的handle卸载的,因为是一个...

如果目标不是元素,比如是一个window那么她会直接往目标上添加标识,比如:window[$.expando]

其实事件跟缓存有很深的关系

卸载全部事件

清空标识

这里的标识包括元素上的和对象上的

$('*').add(window).each(function(){
    try{
        delete this[$.expando];
    }catch(e){}
});



ps:因为window不是元素,但会有一些事件,比如scroll,resize等

删除缓存

这里的缓存包括元素的缓存和对象缓存

window[$.expando] = {}
$.cache = {};


jquery删除已存在的事件实例




Insert title here
javascript" src="jquery.js">

$(document).ready(function(){
      var fn = $("#exportCsv").attr( "onclick" ); // 获取原事件
       $("#exportCsv").unbind('click').removeAttr('onclick');  // 删除原事件
       $("#exportCsv").bind( "click", function() {   // 绑定新事件
            alert( "新事件" );
       });
       $("#exportCsv").bind( "click", fn ); // 绑定原事件
   });







相关文章

精彩推荐