javascript - 销毁免费墙实例

Question

我正在使用 jquery-Freewall-plugin我想知道如何销毁它的一个实例。

我写了一个小例子让你们理解:

var startFreewall = function(){
    $(function() {
        var wall = new freewall("#freewall");
        wall.reset({
            selector: '.brick',
            animate: false,
            cellW: 160,
            cellH: 160,
            delay: 50,
            onResize: function() {
                wall.refresh($('div.col.rood.bart').width()+100, $('div.col.rood.bart').height()+100);
            }
        });
        // caculator width and height for IE7;
        wall.fitZone($('div.col.rood.bart').width()+100 , $('div.col.rood.bart').height()+100);
    });
}
startFreewall();

$('button').click(function(){
    'destroy the function so i can call it again'
});

Answer 1

以下是如果插件不包含 destroy 方法，如何从元素中删除所有插件的所有实例:

$.removeData($element.get(0));

这不会删除绑定(bind)的事件。你必须单独做。如果您尝试删除的插件具有命名空间事件，那么您很幸运:

// Remove namespaced events added using .on()
$element.off('pluginNamespace');
// Remove namespaced events added using .bind()
$element.unbind('.pluginNamespace');

如果没有，您可以检查附加到元素的所有事件:

console.log(
    '$element events:', 
    $._data($element.get(0), 'events')
);

这一切都包含在一个方便的函数中:

var destroyUnwantedPlugin = function($elem, eventNamespace) {
    var isInstantiated  = !! $.data($elem.get(0));

    if (isInstantiated) {
        $.removeData($elem.get(0));
        $elem.off(eventNamespace);
        $elem.unbind('.' + eventNamespace);
    }
};

您需要将实例传递给上述函数:

$('button').click(function(){
    destroyUnwantedPlugin(wall);
});

希望它会起作用:)