jQuery PLUGIN

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