Question

我正在尝试创建一个jquery插件，我希望有以下选项：

$.plugin_name(variable)
$(selector).plugin_name(variable)

插件不需要应用于元素的第一种情况（例如，它可以创建一个）第二种情况，相同的插件将对所选的元素执行任何操作

我的问题是：如何在插件中指定：

if (selector is not given) {
  create an element
} else {
  ( for example) insert variable in elements matching the selector
}

Answer 1

您可以将jQuery.fn.myPluginName = function()....用于对jQuery对象进行操作的插件。

对于jQuery命名空间中的独立函数，您只需设置jQuery.func_name = function()...。

一个例子：

jQuery.fn.erase = function() {
   return this.each(function() {
       jQuery(this).remove();
   });
};

jQuery("body").erase();

jQuery.erase = function(element) {
   jQuery(element).erase();
};

jQuery.erase("body"); // exact same result.

Answer 2

通过使用$.myFunc，您只需向jQuery名称空间添加一个函数。

通过使用$.fn.myFunc，您正在扩展jQuery原型，这意味着函数内的 this 关键字将表示从选择器返回的jQuery对象。

如果您希望他们都做同样的事情，您可以检查jQuery实例并创建一个新元素：

试试这个：

$.myFunc = $.fn.myFunc = function(first, second) {
    if (!(this instanceof $)) {
        return $.fn.myFunc.apply($('<div>'), arguments);
    }
    // begin plugin code here:
    return this.each(function() {
        $(this).text(first + ' ' + second);
    });
};

// now you can call myFunc in two ways:

$('<div>').myFunc('foo','bar').appendTo('body') 

$.myFunc('bar','foo').appendTo('body');

Answer 3

要涵盖$.plugin_name()使用：

jQuery.plugin_name = function(data) {
  // do stuff
}

$(selector).plugin_name()使用：

jQuery.fn.plugin_name = function() {
  return this.each(function() {
    // do stuff
  });
};

请参阅Plugins/Authoring。

jquery插件语法

3 个答案: