javascript - jQuery绑定事件一种奇怪的写法不明白

Question

在看别人的一个datepicker插件的源码的时候，看到它里面绑定事件大量的这种代码

_bindEvents : function () {
            this.$el.on(this.opts.showEvent + '.adp', this._onShowEvent.bind(this));
            this.$el.on('mouseup.adp', this._onMouseUpEl.bind(this));
            this.$el.on('blur.adp', this._onBlur.bind(this));
            this.$el.on('keyup.adp', this._onKeyUpGeneral.bind(this));
            $(window).on('resize.adp', this._onResize.bind(this));
            $('body').on('mouseup.adp', this._onMouseUpBody.bind(this));
        },

第一次见过这种事件后面加上adp的写法，甚是不解。有了解的同学可以帮忙解释一下么。

代码来源：
https://github.com/t1m0n/air-...

Answer 1

jQuery中文文档 - on函数
看一下后边的“命名空间”

Answer 2

所谓的 adp 应该是 自定义的事件

Answer 3

问题已经找到答案了。event.adp后面的adp是event的命名空间。adp是个自己随意取得名字。你也可以给它取名叫amao,agou。添加了这个标识意味着这个事件存放在adp这个命名空间下。如果你之后要触发、移除、绑定特定的事件，你就可以借助这个小东西了。Whatever，这个玩意儿就是干了个区分的事情。get到这一点，你应该明白了这个东西。

为啥要这么做呢？

此为情景一：写jQuery的插件时，需要给element绑定插件自己的事件，但是有时候插件需要销毁自身（经常见到的destroy），这个时候需要解绑事件。但是element自身也可能绑定了事件，如果贸然用off解绑，必然会解绑全部的事件。于是我们可以通过off('click',handle)来解绑我们的事件和处理函数（handle），但是我们绑定事件时经常用的是匿名函数，匿名函数就不能用off(event, handle)的方式了。因此jQuery发明了event namespace 这个玩意儿，解绑的时候，就可以直接解绑这个命名空间的函数了（而不会解绑element自己的事件）。

来个解绑的例子：

destroy: function () {
            var _this = this;
            _this.$el
                .off('.adp')
                .data('datepicker', '');

            _this.selectedDates = [];
            _this.focused = '';
            _this.views = {};
            _this.keys = [];
            _this.minRange = '';
            _this.maxRange = '';

            if (_this.opts.inline || !_this.elIsInput) {
                _this.$datepicker.closest('.datepicker-inline').remove();
            } else {
                _this.$datepicker.remove();
            }
        },

看见没，这样解绑事件就很方便啦！

同样，在触发事件的时候，我们也可以只触发特定的事件。