Question

如何制作一个可以在不使用元素选择器的情况下执行的jQuery插件？

喜欢，通常是：
$('#myElementID').myPluginFunction(myVariables);
但是，相反：
$.myPluginFunction(myVariables);

提前致谢！

Answer 1

实际上您只使用$.extend()代替$.fn.extend()，请阅读here了解更多

$.fn.extend({
   myMethod: function(){...}
});
//jQuery("div").myMethod();

$.extend({
 myMethod2: function(){...}
});
//jQuery.myMethod();

Answer 2

你可以这样做：

$.myPluginFunction = function(vars) {
    //...
};

Answer 3

使用$.extend。这是一个小例子：

$(function() {
    return $.extend({
      addDebugBorder: function(selection, size) {
        return selection.each(function() {
          var color, randomColor;
          randomColor = function() {
            return Math.floor(Math.random() * 256);
          };
          if (!size) size = '5px';
          color = 'rgb(' + randomColor() + ',' + randomColor() + ', ' + randomColor() + ')';
          return $(this).css('border', size + ' solid ' + color);
        });
      }
    });
  });

然后调用

$.addDebugBorder($("table tr td"), '1px');

编辑 - 这个示例代码应该是一个普通的插件，我想我修改它来接受选择器而不是仅仅处理div只是为什么它有点奇怪。

Answer 4

不是将插件分配给jQuery.fn对象，而是将其分配给根jQuery对象本身。

jQuery.myPluginFunction = function(myVariables) {
   // plugin code
}

jQuery插件无需元素即可工作

4 个答案: