Question

我正在尝试按照某些官方best practices

创建一个jQuery插件

(function($){

  var methods = {
    init : function( options ) {
      this.options = options;
    }
  , add_that: function (elem) {
      this.append(elem);
      return (this);
    }
  , add_this: function (elem) {
      return (methods.add_that(elem));
    }
  };

  $.fn.test = function (method) { 
    if ( methods[method] ) {
      return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
    } else if ( typeof method === 'object' || ! method ) {
      return methods.init.apply( this, arguments );
    } else {
      $.error( 'Method ' + method + ' does not exist on jQuery.test' );
    }    
  };

})(jQuery);

我希望方法add_that能够将东西附加到匹配的元素上。
现在从add_this调用此方法。

$('#test').test('add_this', $('<div />'));

TypeError：this.append不是函数

为什么我无法从this访问插件（add_that）？

Answer 1

因为当您从add_this调用范围时，范围已更改。请注意，原始调用使用Function.apply将调用范围限定为this。

if ( methods[method] ) {
  return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
}

所以你可以通过在你的方法中再次使用apply来解决这个问题：

add_this: function (elem) {
  return methods.add_that.apply(this,[elem]);
}

实例：http://jsfiddle.net/XaUHV/

Answer 2

在您使用它的上下文中，“this”指的是methods.add_that

由于methods.add_that是一个函数，默认情况下没有任何方法称为“append”。

jQuery - 插件方法调用

2 个答案: