growing jquery
DESCRIPTION
How to create plugins and extend jQuery.TRANSCRIPT
GROWING JQUERY
How to extend jQuery for your needs
jQuery!
Plugins World
Domination
Attack of the Libraries!
Mad Scientist
Separating the Process
$(‚#id‛,‚div.class‛) $(…).show()
Selection Action
Selection Action jQuery
Cut & Paste
Plugins!
Easy as baking cookies!
$("input:checkbox").click(function(){
var boxes = $(‚input:checkbox‛);
if(boxes.filter(‚:checked‛)
.length < 3) {
this.checked = true;
}
});
jQuery.fn.limit = function(n) {
var self = this;
return this.click(function(){
return self
.filter(":checked").length<=n;
});
};
$("input:checkbox").limit(3);
Boring Method Way Cooler Method
“How can I limit the user to only select up to 3 checkboxes?”
Cute Plugins
$.fn.vals = function(){
var v=[];
this.each(function(){ v.push( $(this).val() ); });
return v;
});
$.fn.zebra = function(){
return this.filter(‚:odd‛)
.addClass(‚odd‛).end();
};
Extending jQuery
jQuery.expr[‘:’].mod = ‚i%(m[3]-0)==0‛;
jQuery.expr[‘:’].date = ‚/^\\s*\\d{2}\\/\\d{2}\\/\\d{4}\\s*$/
.test( jQuery(a).text() || ‚‛ )‛;
Simplicity
$(…).idTabs(2);
$(…).idTabs(‚default‛)
$(…).idTabs(function(id){
alert(‚Clicked ‛+id);
});
$(…).idTabs({
start: ‚default‛,
change: ‚false‛
});
Questions?
Sean Catchpole [email protected]