如何创建jQuery函数（新的jQuery方法或插件）？

我知道JavaScript中的语法如下：

function myfunction(param){
  //some code
}

有没有一种方法可以在jQuery中声明可以添加到元素的函数？例如：

$('#my_div').myfunction()

从文档中：

(function( $ ){
   $.fn.myfunction = function() {
      alert('hello world');
      return this;
   }; 
})( jQuery );

那你做

$('#my_div').myfunction();

尽管您已经收到了所有答案，但值得注意的是，您无需编写插件即可在函数中使用jQuery。当然，如果它只是一个简单的一次性函数，我相信编写插件是过大的。只需将选择器作为参数传递给函数，就可以轻松得多。您的代码如下所示：

function myFunction($param) {
   $param.hide();  // or whatever you want to do
   ...
}

myFunction($('#my_div'));

请注意，$变量名$param中的不需要。易于记住该变量包含jQuery选择器只是我的一种习惯。您也可以使用param。

尽管这里有大量的文档/教程，但您的问题的简单答案是：

// to create a jQuery function, you basically just extend the jQuery prototype
// (using the fn alias)

$.fn.myfunction = function () {
    // blah
};

在该函数内部，该this变量对应于您在其上调用函数的jQuery包装集。所以像这样：

$.fn.myfunction = function () {
    console.log(this.length);
};

$('.foo').myfunction();

...将把带有类的元素数刷新到控制台foo。

当然，语义还有很多东西（以及最佳实践和所有爵士乐），因此请确保您已读懂它。

要使函数在jQuery对象上可用，请将其添加到jQuery原型中（fn是jQuery中原型的快捷方式），如下所示：

jQuery.fn.myFunction = function() {
    // Usually iterate over the items and return for chainability
    // 'this' is the elements returns by the selector
    return this.each(function() { 
         // do something to each item matching the selector
    }
}

通常将其称为jQuery插件。

示例-http://jsfiddle.net/VwPrm/

是的，您要描述的是一个jQuery插件。

要编写jQuery插件，您可以使用JavaScript创建一个函数，并将其分配给object的一个属性jQuery.fn。

例如

jQuery.fn.myfunction = function(param) {
    // Some code
}

在您的插件函数中，this关键字设置为在其上调用您的插件的jQuery对象。因此，当您这样做时：

$('#my_div').myfunction()

然后将thisinside myfunction设置为返回的jQuery对象$('#my_div')。

有关完整的故事，请参见http://docs.jquery.com/Plugins/Authoring。

$(function () {
    //declare function 
    $.fn.myfunction = function () {
        return true;
    };
});

$(document).ready(function () {
    //call function
    $("#my_div").myfunction();
});

您还可以使用扩展（创建jQuery插件的方式）：

$.fn.extend(
{
    myfunction: function () 
    {
    },

    myfunction2: function () 
    {
    }
});

用法：

$('#my_div').myfunction();

您可以编写自己的jQuery插件（可以在选定元素上调用的函数），如下所示：

（函数（$）{
    $ .fn.myFunc = function（param1，param2）{
        // this-jquery对象保存您选择的元素
    }
}）（jQuery）;

稍后再调用，例如：

$（'div'）。myFunc（1，null）;

是的，您应用于使用jquery选择的元素的方法称为jquery插件，并且在jquery文档中有大量的创作信息。

它值得指出的是jQuery的是刚刚的javascript，所以有关于“jQuery的方法，”没有什么特别的。

创建一个“ colorize”方法：

$.fn.colorize = function custom_colorize(some_color) {
    this.css('color', some_color);
    return this;
}

用它：

$('#my_div').colorize('green');

这个简单的示例结合了jQuery文档中有关如何创建基本插件的优点，并提供了@Candide和@Michael的答案。

• 甲命名函数表达式可以改善叠层迹线等
• 返回的自定义方法this 可以被链接。（感谢@Potheek。）

您可以随时这样做：

jQuery.fn.extend({
   myfunction: function(param){
       // code here
   },
});
OR
jQuery.extend({
   myfunction: function(param){
       // code here
   },
});
$(element).myfunction(param);

听起来您想通过其原型扩展jQuery对象（也称为编写jQuery插件）。这意味着通过调用jQuery函数（$(selector/DOM element)）创建的每个新对象都将具有此方法。

这是一个非常简单的示例：

$.fn.myFunction = function () {
    alert('it works');
};

演示版

在jQuery中实现任何功能的最简单示例是

jQuery.fn.extend({
    exists: function() { return this.length }
});

if($(selector).exists()){/*do something here*/}