13 ответов:
С Docs:
(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 и назначаете ее свойству на объекте
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 для полной истории.
$(function () { //declare function $.fn.myfunction = function () { return true; }; }); $(document).ready(function () { //call function $("#my_div").myfunction(); });
да, методы, которые вы применяете к элементам, выбранным с помощью jquery, называются плагинами jquery и есть хорошее количество информации о создании в документах jquery.
стоит отметить, что jquery и просто javascript, поэтому нет ничего особенного в "методе jquery".
вы можете написать свои собственные плагины jQuery (функция, которая может быть вызвана на выбранных элементах), как показано ниже:
(function( $ ){ $.fn.myFunc = function(param1, param2){ //this - jquery object holds your selected elements } })( jQuery );
Позвоните ему позже, как:$('div').myFunc(1, null);
вы также можете использовать расширения (способ создания плагинов jQuery):
$.fn.extend( { myfunction: function () { }, myfunction2: function () { } });использование:
$('#my_div').myfunction();
вы всегда можете сделать это:
jQuery.fn.extend({ myfunction: function(param){ // code here }, }); OR jQuery.extend({ myfunction: function(param){ // code here }, }); $(element).myfunction(param);
похоже, вы хотите расширить объект jQuery через его прототип (aka написать плагин 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*/}
создать метод" раскрасить":
$.fn.colorize = function custom_colorize(some_color) { this.css('color', some_color); return this; }использовать:
$('#my_div').colorize('green');этот простой пример сочетает в себе лучшее из как создать базовый плагин в документах jQuery и ответы от @Candide, @Michael.
- A выражения с именованными фунциями может улучшить трассировки стека, и т. д.
- пользовательский метод, который возвращает
thisможет быть прикован. (Благодаря @Potheek.)
Comments