jquery plugin
TRANSCRIPT
$.fn.myPlugin();
VytváramejQuery
PLUGIN
vlastný
Najskôr úvod
var x = {};
var x = {};
Object Definition
var x = { doMath: function(){…}
};
var x = { doMath: function(){…}
};
Object Method
…on(‘click’, function(){…})
Anonymous Function
…on(‘click’, function(){…})
“…a function without name”
(doMath)();
(doMath)();
Function Closure
Add some magic
(function(x){…})(abc);
Function Closurewith Anonymous Function
“Tak ako urobím ten plugin?”Comic Sans
Takto!Plugin sa bude volať
yolo
Úplný základ je…
jQuery.fn.yolo = function () { // Your code };
jQuery.fn.yolo = function () { // Your code return this; };
jQuery.fn.yolo = function () { // Your code return this; };
jQuery.fn.yolo = function () { return $(this).each(function () { // Your code });};
jQuery.fn.yolo = function () { return $(this).each(function () { // Your code }); };
(function ($) { $.fn.yolo = function () { return $(this).each(function () { // Your code }); }; })(jQuery);
(function ($) { $.fn.yolo = function () { return $(this).each(function () { // Your code }); }; })(jQuery);
(function ($) { $.fn.yolo = function (options) { return $(this).each(function () { // Your code }); }; })(jQuery);
(function ($) { $.fn.yolo = function (options) { return $(this).each(function () { // Your code }); }; })(jQuery);
(function ($) { $.fn.yolo = function (options) { var settings = $.extend({}, options); return $(this).each(function () { // Your code }); }; })(jQuery);
(function ($) { $.fn.yolo = function (options) { var settings = $.extend({}, options); return $(this).each(function () { // Your code }); }; })(jQuery);
(function ($) { $.fn.yolo = function (options, callback) { var settings = $.extend({}, options); return $(this).each(function () { // Your code (callback)(); }); }; })(jQuery);
(function ($) { $.fn.yolo = function (options, callback) { var settings = $.extend({}, options); return $(this).each(function () { // Your code (callback)(); }); }; })(jQuery);
That’s simple start folks!
Zdroje ďalších informácií• https://developer.mozilla.org/en-US/docs/Web/JavaScript/
Introduction_to_Object-Oriented_JavaScript
• http://learn.jquery.com/plugins/
• http://learn.jquery.com/performance/
• http://learn.jquery.com/code-organization/
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Methods_Index
Otázky?© 2015 by Mino