开发者

How do I implement a "remove" method into my script?

I have the JavaScript script / library which is almost working great, except I can't seem to be able to wrap my head around how to add a remove method. For example you'd do something like (jQuery was added just got cleaner, and easier to understand example, but my script doesn't require jQuery):

//Adds a "widget" to the memory
Core.extend('widget',function(m){
  $(window).click(function(){ alert(m); });
});

//Actually loads widget, and will alert "hello world" each click on the body
Core.load('widget', 'hello world');

//*SHOULD* make it so that when I click on the window the alert no longer shows
Core.remove('widget');

Here's the code I'm writing

var Core = function(){
  var debug = function(m){
    console.log(m);
  }

  var errors = false;

  var extensions = {};

  var listeners = {};

  var extend = function(name,func){
    name = name || '';
    func = func || function(){};
    if(typeof extensions[name] == 'undefined'){
      extensions[name] = func;
    }
    else{
      if(errors){
        throw new Error('Core extend() error: the extension "'+name+'" already exists');
      }
    }
  }

  var load = function(name,params){
    nam开发者_运维问答e = name || '';
    params = params || '';
    if(typeof extensions[name]  !== 'undefined'){
      extensions[name](params);
    }
    else{
      if(errors){
        throw new Error('Core load() error: the extension "'+name+'" doesn\'t exist');
      }
    }
  }

  //Sends out a notification to every listener set with this name
  var push = function(name, value){
    name = name || '';
    value = value || '';
    if(typeof listeners[name] !== 'undefined'){
      listeners[name].call(this,value);
    }
    else{
      if(errors){
        throw new Error('Core push() error: the extension "'+name+'" doesn\'t exist');
      }
    }
  }

  //Saves a function to the listeners object to be called by push()
  var listen = function(name, callback){
    name = name || '';
    callback = callback || function(){};
    listeners[name] = callback;
  }

  //Removes an extension from being called
  var remove = function(name){
    name = name || '';
    if(typeof extensions[name] !== 'undefined'){
      delete extensions[name];
    }
    else{
      if(errors){
        throw new Error('Core remove() error: the extension "'+name+'" doesn\'t exist');
      }
    }
  }

  return {
    extend:extend,
    load:load,
    remove:remove,
    push:push,
    listen:listen
  }
}();

Example use case:

http://jsbin.com/enopup


In your example, your widget actually attach an event handler for the click event.

Removing your widget from your library object is not enough, since you attached an event listener, you have to remove it.

Unbind

With jQuery you can use the .unbind() method to remove every event handler attached to a specific element.

This way when you click again it won't do anything.


your problem is that are removing the function from Core but not unbinding the onClick call. I suspect this is being cached in the browser. You can quickly confirm this by adding $(window).unbind('click') after your remove call.

The JS is beyond me but what I would recommend is perhaps a descructor method to unbind any such actions that may be taken.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜