/ Work

[jQuery note.] 關於一點點 Namespace Event 的事情

在改寫自己的 Plugin 的時候出現了一個問題,由於 Event 在 Plugin 中宣告之後,如果重新再次綁定 Plugin
的時候,那麼裡面的 Event 有可能會被重新再綁定一次(等於重複註冊)。所以,後來你就會發現,你的所綁定的物件怎麼不太一樣了。

這時候可以用 Namespace 來解決這件事情。

$("div.myClick").bind("click.myClick", function(event) { ... });

在一般的 Event 中用點相連的就是我們自己所指定的 Namespace,用以區別一般的 Click 事件。當然,如果要將他解除,也是用相同的方式就可以了。

$("div.myClick").unbind("click.myClick");

當然,你也可以用這種方法來解除綁定(這樣的意思就是,解除所有 Namespace 為 .myClick 的所有事件):

$("*").unbind(".myClick");

這種方式在自行撰寫的 Plugin 中特別有用,除了可以避免與一般的外部宣告混淆之外,也能夠確保 Plugin 中的元素運作正常。當然啦,如果硬是從 Plugin 外部直接使用 Event 來綁定物件,還是會干涉到 Plugin 中的運行的,這是無法避免的事實。倘若,你在撰寫 Plugin 時有使用到任何的 Event 綁定的話(或是委任),建議使用 Namespace 的方式去綁定會比較保險。

然後在一開始,可以做一次 cleanup,確保不會有相同的 Namespace 干擾。

jQuery.fn.myPlugin = function() {
    return this.each(function() {
        jQuery("*", this).unbind(".myPlugin");
        //Do your plugin here.
    });
};

大抵上是這樣。