2010-03-28 26 views
80

Próbuję dać moje funkcjonalność wtyczki zwrotnej, i chciałbym na to, aby działać w nieco tradycyjny sposób:jQuery Plugin: Dodawanie funkcji oddzwaniania

myPlugin({options}, function() { 
    /* code to execute */ 
}); 

lub

myPlugin({options}, anotherFunction()); 

Jak obsłużyć ten parametr w kodzie? Czy jest traktowany jako jeden pełny byt? Jestem prawie pewien, że wiem, gdzie umieścić kod egzekucyjny, ale jak mogę uzyskać kod do wykonania? Nie mogę znaleźć wiele literatury na ten temat, więc z góry dzięki za pomoc.

+2

swoim drugim składnia wywołuje funkcję zamiast ją przekazywać. Musisz usunąć '()' – SLaks

+6

Osobiście uważam, że lepiej wyłączyć wywołanie zwrotne jako część parametru "options". Jest to szczególnie prawdziwe, jeśli rozwinie się, że istnieje więcej powodów niż jeden, aby dostarczyć wywołanie zwrotne. – Pointy

+1

Jak by coś takiego wyglądało, Pointy? Czy chcesz udzielić odpowiedzi? – dclowd9901

Odpowiedz

159

Wystarczy wykonać zwrotnego we wtyczce:

$.fn.myPlugin = function(options, callback) { 
    if (typeof callback == 'function') { // make sure the callback is a function 
     callback.call(this); // brings the scope to the callback 
    } 
}; 

można również wywołania zwrotnego w opcjach obiektu:

$.fn.myPlugin = function() { 

    // extend the options from pre-defined values: 
    var options = $.extend({ 
     callback: function() {} 
    }, arguments[0] || {}); 

    // call the callback and apply the scope: 
    options.callback.call(this); 

}; 

Używaj go jak to:

$('.elem').myPlugin({ 
    callback: function() { 
     // some action 
    } 
}); 
+0

Dziękuję bardzo, sir. Działa jak marzenie. – dclowd9901

+0

Wystarczy dodać do tej odpowiedzi. Jest post wyjaśniający to: http://jquery-howto.blogspot.com/2009/11/create-callback-functions-for-your.html – RaphaelDDL

+0

@David Jak dodać parametr wywołania zwrotnego, chcę to zrobić ' $ ('. elem'). myPlugin ({callback: function (param) {// jakaś akcja}}; ' –

1

Zmień funkcję wtyczki, aby uzyskać drugi parametr. Zakładając, że użytkownik przekazuje funkcję, parametr ten można traktować jako zwykłą funkcję.
Należy pamiętać, że można również uczynić wywołanie zwrotne właściwością parametru options.

Na przykład:

$.fn.myPlugin = function(options, callback) { 
    ... 

    if(callback)  //If the caller supplied a callback 
     callback(someParam); 

    ... 
}); 
5

Nie wiem, czy dobrze rozumiem twoje pytanie. Ale w przypadku drugiej wersji: Natychmiast zadzwoniłoby pod numer anotherFunction.

Zasadniczo Twój Wtyczka powinna być jakaś funkcja, która wygląda następująco:

var myPlugin = function(options, callback) { 
    //do something with options here 
    //call callback 
    if(callback) callback(); 
} 

Trzeba zapewnić funkcję obiekt jako zwrotnego, więc albo function(){...} lub anotherFunction (bez ()).

4

Przywracanie podmuchu przeszłości.

Warto zauważyć, że jeśli masz dwa argumenty przekazane, na przykład:

$.fn.plugin = function(options, callback) { ... }; 

Następnie zadzwonić do wtyczki bez argumentu opcji, ale z zwrotnego Pokochasz więc napotkasz zagadnień:

$(selector).plugin(function() {...}); 

używam tego zrobić to trochę bardziej elastyczny:

if($.isFunction(options)) { callback = options } 
0

przykładem nieco późno, bu może to być przydatne. Używając argumentów można utworzyć tę samą funkcję.

$.fn.myPlugin = function() { 
    var el = $(this[0]); 
    var args = arguments[0] || {}; 
    var callBack = arguments[1]; 
    ..... 
    if (typeof callback == 'function') { 
     callback.call(this); 
    } 
} 
1

myślę, że to może pomóc

// Create closure. 
 
(function($) { 
 
    
 
    // This is the easiest way to have default options. 
 
    
 
     var settings = $.extend({ 
 
      // These are the defaults. 
 
    
 
      onready: function(){}, 
 
    
 
      //Rest of the Settings goes here... 
 
     }, options); 
 
    
 
    // Plugin definition. 
 
    $.fn.hilight = function(options) { 
 
    
 
     //Here's the Callback 
 
     settings.onready.call(this); 
 
    
 
     //Your plugin code goes Here 
 
    }; 
 
    
 
// End of closure. 
 
    
 
})(jQuery);

miałem wspólny artykuł na temat tworzenia własnych jQuery Plugin.I że należy sprawdzić, czy http://mycodingtricks.com/jquery/how-to-create-your-own-jquery-plugin/

Powiązane problemy