你的位置:首页 > 软件开发 > Java > jquery的事件命名空间详解

jquery的事件命名空间详解

发布时间:2016-04-04 11:00:05
jquery现在的事件API:on,off,trigger支持带命名空间的事件,当事件有了命名空间,就可以有效地管理同一事件的不同**,在定义组件的时候,能够避免同一元素应用到不同组件时,同一事件类型之间的影响,还能控制一些意外的事件冒泡。在实际工作中,相信大家都用的很多,但是 ...

jquery的事件命名空间详解

jquery现在的事件API:on,off,trigger支持带命名空间的事件,当事件有了命名空间,就可以有效地管理同一事件的不同**,在定义组件的时候,能够避免同一元素应用到不同组件时,同一事件类型之间的影响,还能控制一些意外的事件冒泡。在实际工作中,相信大家都用的很多,但是不一定了解它的所有细节,至少我有这样的经验,经常在碰到疑惑的时候,还得重新写例子去验证它的相关作用,所以本文想把事件命名空间相关的细节都梳理出来,将来再犯迷糊的时候可以回来翻着看看以便加深对它的理解和运用。

在详细了解命名空间之前,得先认识下什么是自定义事件,因为命名空间可以同时应用于自定义事件和浏览器默认事件当中。

1. 自定义事件

我们在定义组件的时候,浏览器的默认事件往往不能满足我们的要求,比如我们写了一个树形组件,它有一个实例方法init用来完成这个组件的初始化工作,在这个方法调用结束之后,我们通常会自定义一个init事件,以便外部可以在树组件初始化完成之后做一些回调处理:

<script src='/images/loading.gif' data-original="../js/lib/jquery.js"></script><div id="tree"></div><script>  var Tree = function(element, options) {    var $tree = this.$tree = $(element);    //监听init事件,触发    $tree.on('init', $.proxy(options.onInit, this));    this.init();  };  Tree.prototype.init = function() {    console.log('tree init!');    this.$tree.trigger('init');  };  var tree = new Tree('#tree', {    onInit: function() {      console.log(this.$tree.outerHeight());    }  });</script>

原标题:jquery的事件命名空间详解

关键词:jquery

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

可能感兴趣文章

我的浏览记录