插件方法未定义

Question

我想创建我的第一个插件，当我加入一个项目叫add功能，所以对象记录，但获得有关onAdd is undefined错误（见下文）

这里是插件

$(function() { 
    var settings = { 
     onAdd: function() {}, 
     onRemove: function() {}, 
     sourceSelecter: null, 
     targetSelector: null 
    }; 

    $.fn.tokenizer = function (options) { 

     settings = $.extend({ 
      targetSelector: this, 
      idName: 'id' 
     }, options); 

     this.add = function (item) { 
      console.log (settings) 
      settings.onAdd.call(item); 
     }; 

     this.remove = function (item) { 
      settings.onRemove.call(item); 
     }; 
     return this; 
    }; 
}(jQuery)); 

这里是控制台：

Object { targetSelector: Object, idName: "id", sourceSelector: "group" }

TypeError: settings.onAdd is undefined

有人可以enlighened我，为什么会出现在我的没有onAdd功能？

Answer 1

您在扩展时不包含原始settings对象。另外我建议你创建this.settings字段，以保持默认settings分开：

$(function() { 
    var settings = { 
    onAdd: function() {}, 
    onRemove: function() {}, 
    sourceSelecter: null, 
    targetSelector: null 
    }; 

    $.fn.tokenizer = function(options) { 
    this.settings = $.extend({}, { 
     targetSelector: this, 
     idName: 'id' 
    }, settings, options); 

    this.add = function(item) { 
     console.log(this.settings) 
     this.settings.onAdd.call(item); 
    }; 

    this.remove = function(item) { 
     this.settings.onRemove.call(item); 
    }; 
    return this; 
    }; 
}(jQuery));