Как создать функцию jQuery (новый метод jQuery или плагин)?

Ответ 1

Из Docs:

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

Затем вы делаете

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

Ответ 2

Несмотря на все ответы, которые вы уже получили, стоит отметить, что вам не нужно писать плагин для использования jQuery в функции. Конечно, если это простая, разовая функция, я считаю, что писать плагин слишком много. Это можно сделать гораздо проще, просто передав селектор функции в качестве параметра. Ваш код будет выглядеть примерно так:

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

myFunction($('#my_div'));

Обратите внимание, что $ в имени переменной $param не требуется. Просто моя привычка позволяет легко запомнить, что эта переменная содержит селектор jQuery. Вы можете просто использовать param.

Ответ 3

Несмотря на то, что документация/учебные пособия , простой ответ на ваш вопрос таков:

// 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.

Конечно, есть немного больше семантики, чем это (а также лучшие практики и весь этот джаз), поэтому обязательно прочитайте об этом.

Ответ 4

Чтобы сделать функцию доступной в объектах 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/

Ответ 5

Yup - то, что вы описываете, является плагином jQuery.

Чтобы написать плагин jQuery, вы создаете функцию в JavaScript и присваиваете ее свойству на объекте jQuery.fn.

например.

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

В вашей плагиновой функции ключевое слово this устанавливается в объект jQuery, на который был вызван ваш плагин. Итак, когда вы это сделаете:

$('#my_div').myfunction()

Затем this внутри myfunction будет установлен объект jQuery, возвращаемый $('#my_div').

Подробнее см. http://docs.jquery.com/Plugins/Authoring.

Ответ 6

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

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

Ответ 7

Вы также можете использовать expand (способ создания jQuery-плагинов):

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

    myfunction2: function () 
    {
    }
});

Использование:

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

Ответ 8

Вы можете написать свои собственные плагины jQuery (функцию, которая может быть вызвана для выбранных элементов), как показано ниже:

(function( $ ){
    $.fn.myFunc = function(param1, param2){
        //this - jquery object holds your selected elements
    }
})( jQuery );

Назовите его позже, например:

$('div').myFunc(1, null);

Ответ 9

Да, методы, которые вы применяете к элементам, выбранным с помощью jquery, называются jQuery-плагинами и хороший объем информации об авторстве в jquery документы.

Стоит отметить, что jquery - это просто javascript, поэтому нет ничего особенного в "методе jquery".

Ответ 10

Вы всегда можете сделать это:

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

Ответ 11

Похоже, вы хотите расширить объект jQuery через прототип (aka написать плагин jQuery). Это означало бы, что каждый новый объект, созданный при вызове функции jQuery ($(selector/DOM element)), будет иметь этот метод.

Вот очень простой пример:

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

Демо

Ответ 12

Создайте метод "colorize":

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

Используйте его:

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

Этот простой пример сочетает в себе лучшие Как создать базовый плагин в документах jQuery и ответы от @Candide, @Michael.

• A указанное выражение функции может улучшить трассировку стека и т.д.
• Пользовательский метод, который возвращает this может быть привязан. (Спасибо @Potheek.)

Ответ 13

Простейшим примером создания любой функции в jQuery является

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

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

Ответ 14

JQuery (функция ($) {

..ваш код $..

});