From 359a583075261d73b948e0de80e8324e47d3b9e9 Mon Sep 17 00:00:00 2001 From: Akkuma Date: Tue, 25 Jan 2011 09:16:51 -0800 Subject: [PATCH 1/9] Modified the library to use delegates rather than binding. Streamlined options by removing separate checked and selected classes. Improved performance by using native operations as much as possible and checking if the input has already been initiated. DRY'd the code. --- js/jquery.ezmark.js | 92 ++++++++++++++++++++++----------------------- 1 file changed, 44 insertions(+), 48 deletions(-) diff --git a/js/jquery.ezmark.js b/js/jquery.ezmark.js index 9e4d79c..257df31 100644 --- a/js/jquery.ezmark.js +++ b/js/jquery.ezmark.js @@ -16,62 +16,58 @@ * $('selector').ezMark([options]); * * [options] accepts following JSON properties: - * checkboxCls - custom Checkbox Class - * checkedCls - checkbox Checked State's Class - * radioCls - custom radiobutton Class - * selectedCls - radiobutton's Selected State's Class + * checkboxClass - custom checkbox class + * checkedClass - checked state's class + * radioClass - custom radiobutton class * * * * View Documention/Demo here: * http://www.itsalif.info/content/ezmark-jquery-checkbox-radiobutton-plugin * - * @author Abdullah Rubiyath - * @version 1.0 - * @date June 27, 2010 + * @author Abdullah Rubiyath, Gregory Waxman + * @version 2.0 + * @date January 25, 2011 */ -(function($) { - $.fn.ezMark = function(options) { - options = options || {}; - var defaultOpt = { - checkboxCls : options.checkboxCls || 'ez-checkbox' , radioCls : options.radioCls || 'ez-radio' , - checkedCls : options.checkedCls || 'ez-checked' , selectedCls : options.selectedCls || 'ez-selected' , - hideCls : 'ez-hide' - }; - return this.each(function() { - var $this = $(this); - var wrapTag = $this.attr('type') == 'checkbox' ? '
' : '
'; - // for checkbox - if( $this.attr('type') == 'checkbox') { - $this.addClass(defaultOpt.hideCls).wrap(wrapTag).change(function() { - if( $(this).is(':checked') ) { - $(this).parent().addClass(defaultOpt.checkedCls); - } - else { $(this).parent().removeClass(defaultOpt.checkedCls); } - }); - - if( $this.is(':checked') ) { - $this.parent().addClass(defaultOpt.checkedCls); - } - } - else if( $this.attr('type') == 'radio') { +(function ($) { + $.fn.ezMark = function (options) { + var defaults = { + checkboxClass: 'ez-checkbox', + radioClass: 'ez-radio', + checkedClass: 'ez-checked', + hideClass: 'ez-hide' + }; - $this.addClass(defaultOpt.hideCls).wrap(wrapTag).change(function() { - // radio button may contain groups! - so check for group - $('input[name="'+$(this).attr('name')+'"]').each(function() { - if( $(this).is(':checked') ) { - $(this).parent().addClass(defaultOpt.selectedCls); - } else { - $(this).parent().removeClass(defaultOpt.selectedCls); - } - }); - }); - - if( $this.is(':checked') ) { - $this.parent().addClass(defaultOpt.selectedCls); - } - } + $.extend(defaults, options) + + return this.each(function () { + var type = this.type; + + if ((type === 'radio' || type === 'checkbox') && !$.data(this, 'ezmark-checkedclass')) { + var $this = $(this); + var className = type === 'checkbox' ? defaults.checkboxClass : defaults.radioClass; + + $this.addClass(defaults.hideClass + ' ez-mark-del').wrap('
'); + this.checked && $this.parent().addClass(defaults.checkedClass); + $.data(this, 'ezmark-checkedclass', defaults.checkedClass); + } + }); + } + + $(function () { + $(document.body).delegate('.ez-mark-del', 'change', function () { + var $this = $(this); + var type = this.type; + var className = $.data(this, 'ezmark-checkedclass'); + + if (type === 'checkbox') { + $this.parent().[(this.checked ? 'add' : 'remove')+'Class'](className); + } + else if (type === 'radio') { + $('input[name="' + this.name + '"]').parent().removeClass(className); + this.checked && $this.parent().addClass(className); + } + }); }); - } })(jQuery); \ No newline at end of file From c704afab5e0e84026bf1b5b72ab027ac8a1900a6 Mon Sep 17 00:00:00 2001 From: Akkuma Date: Tue, 25 Jan 2011 10:45:23 -0800 Subject: [PATCH 2/9] Removed extra "." --- js/jquery.ezmark.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/jquery.ezmark.js b/js/jquery.ezmark.js index 257df31..8a1130b 100644 --- a/js/jquery.ezmark.js +++ b/js/jquery.ezmark.js @@ -62,7 +62,7 @@ var className = $.data(this, 'ezmark-checkedclass'); if (type === 'checkbox') { - $this.parent().[(this.checked ? 'add' : 'remove')+'Class'](className); + $this.parent()[(this.checked ? 'add' : 'remove')+'Class'](className); } else if (type === 'radio') { $('input[name="' + this.name + '"]').parent().removeClass(className); From f58c92c0ee1d0017695d4052dd46cf5af59cc92c Mon Sep 17 00:00:00 2001 From: Akkuma Date: Tue, 25 Jan 2011 15:09:41 -0800 Subject: [PATCH 3/9] Added hover support onto labels and the div. --- js/jquery.ezmark.js | 52 ++++++++++++++++++++++++++++++++------------- 1 file changed, 37 insertions(+), 15 deletions(-) diff --git a/js/jquery.ezmark.js b/js/jquery.ezmark.js index 8a1130b..a10a683 100644 --- a/js/jquery.ezmark.js +++ b/js/jquery.ezmark.js @@ -31,12 +31,16 @@ */ (function ($) { + var NAMESPACE = 'ezmark'; + var DELEGATE_CLASS = NAMESPACE + '-del'; + $.fn.ezMark = function (options) { var defaults = { - checkboxClass: 'ez-checkbox', - radioClass: 'ez-radio', - checkedClass: 'ez-checked', - hideClass: 'ez-hide' + checkboxClass: NAMESPACE + '-checkbox', + radioClass: NAMESPACE + '-radio', + checkedClass: NAMESPACE + '-checked', + hideClass: NAMESPACE + '-hide', + hoverClass: NAMESPACE + '-hover' }; $.extend(defaults, options) @@ -44,30 +48,48 @@ return this.each(function () { var type = this.type; - if ((type === 'radio' || type === 'checkbox') && !$.data(this, 'ezmark-checkedclass')) { + if ((type === 'radio' || type === 'checkbox') && !$.data(this, NAMESPACE)) { var $this = $(this); var className = type === 'checkbox' ? defaults.checkboxClass : defaults.radioClass; - - $this.addClass(defaults.hideClass + ' ez-mark-del').wrap('
'); - this.checked && $this.parent().addClass(defaults.checkedClass); - $.data(this, 'ezmark-checkedclass', defaults.checkedClass); + + $this.addClass(defaults.hideClass + ' ' + DELEGATE_CLASS).wrap('
'); + var $parent = $this.parent(); + this.checked && $parent.addClass(defaults.checkedClass); + $('label[for=' + this.id + ']').addClass(DELEGATE_CLASS); + $.data( + $parent[0], + NAMESPACE, + { + classNames: { + checkedClass: defaults.checkedClass, + hoverClass: defaults.hoverClass + } + } + ); } }); } - $(function () { - $(document.body).delegate('.ez-mark-del', 'change', function () { + $(function () { + $(document.body).delegate('input.' + DELEGATE_CLASS, 'change', function () { var $this = $(this); var type = this.type; - var className = $.data(this, 'ezmark-checkedclass'); + var $parent = $this.parent(); + var parent = $parent[0]; + var className = $.data(parent, NAMESPACE).classNames.checkedClass; - if (type === 'checkbox') { - $this.parent()[(this.checked ? 'add' : 'remove')+'Class'](className); + if (type === 'checkbox') { + $parent[(this.checked ? 'add' : 'remove') + 'Class'](className); } else if (type === 'radio') { $('input[name="' + this.name + '"]').parent().removeClass(className); - this.checked && $this.parent().addClass(className); + this.checked && $parent.addClass(className); } + }).delegate('div.' + DELEGATE_CLASS, 'hover', function () { + $(this).toggleClass($.data(this, NAMESPACE).classNames.hoverClass); + }).delegate('label.' + DELEGATE_CLASS, 'hover', function () { + var $divWrapper = $('#' + this.htmlFor).parent(); + $divWrapper.toggleClass($.data($divWrapper[0], NAMESPACE).classNames.hoverClass); }); }); })(jQuery); \ No newline at end of file From c981aeaee110b891dd96797478cc0738bf5d07c8 Mon Sep 17 00:00:00 2001 From: Akkuma Date: Tue, 25 Jan 2011 15:09:41 -0800 Subject: [PATCH 4/9] Added constants for the namespace and delegate class. Added a hover class onto the wrapping container when label or div is hovered. Made the data stored on each input more flexible by storing as an object. Made the delegates more specific. --- js/jquery.ezmark.js | 52 ++++++++++++++++++++++++++++++++------------- 1 file changed, 37 insertions(+), 15 deletions(-) diff --git a/js/jquery.ezmark.js b/js/jquery.ezmark.js index 8a1130b..a10a683 100644 --- a/js/jquery.ezmark.js +++ b/js/jquery.ezmark.js @@ -31,12 +31,16 @@ */ (function ($) { + var NAMESPACE = 'ezmark'; + var DELEGATE_CLASS = NAMESPACE + '-del'; + $.fn.ezMark = function (options) { var defaults = { - checkboxClass: 'ez-checkbox', - radioClass: 'ez-radio', - checkedClass: 'ez-checked', - hideClass: 'ez-hide' + checkboxClass: NAMESPACE + '-checkbox', + radioClass: NAMESPACE + '-radio', + checkedClass: NAMESPACE + '-checked', + hideClass: NAMESPACE + '-hide', + hoverClass: NAMESPACE + '-hover' }; $.extend(defaults, options) @@ -44,30 +48,48 @@ return this.each(function () { var type = this.type; - if ((type === 'radio' || type === 'checkbox') && !$.data(this, 'ezmark-checkedclass')) { + if ((type === 'radio' || type === 'checkbox') && !$.data(this, NAMESPACE)) { var $this = $(this); var className = type === 'checkbox' ? defaults.checkboxClass : defaults.radioClass; - - $this.addClass(defaults.hideClass + ' ez-mark-del').wrap('
'); - this.checked && $this.parent().addClass(defaults.checkedClass); - $.data(this, 'ezmark-checkedclass', defaults.checkedClass); + + $this.addClass(defaults.hideClass + ' ' + DELEGATE_CLASS).wrap('
'); + var $parent = $this.parent(); + this.checked && $parent.addClass(defaults.checkedClass); + $('label[for=' + this.id + ']').addClass(DELEGATE_CLASS); + $.data( + $parent[0], + NAMESPACE, + { + classNames: { + checkedClass: defaults.checkedClass, + hoverClass: defaults.hoverClass + } + } + ); } }); } - $(function () { - $(document.body).delegate('.ez-mark-del', 'change', function () { + $(function () { + $(document.body).delegate('input.' + DELEGATE_CLASS, 'change', function () { var $this = $(this); var type = this.type; - var className = $.data(this, 'ezmark-checkedclass'); + var $parent = $this.parent(); + var parent = $parent[0]; + var className = $.data(parent, NAMESPACE).classNames.checkedClass; - if (type === 'checkbox') { - $this.parent()[(this.checked ? 'add' : 'remove')+'Class'](className); + if (type === 'checkbox') { + $parent[(this.checked ? 'add' : 'remove') + 'Class'](className); } else if (type === 'radio') { $('input[name="' + this.name + '"]').parent().removeClass(className); - this.checked && $this.parent().addClass(className); + this.checked && $parent.addClass(className); } + }).delegate('div.' + DELEGATE_CLASS, 'hover', function () { + $(this).toggleClass($.data(this, NAMESPACE).classNames.hoverClass); + }).delegate('label.' + DELEGATE_CLASS, 'hover', function () { + var $divWrapper = $('#' + this.htmlFor).parent(); + $divWrapper.toggleClass($.data($divWrapper[0], NAMESPACE).classNames.hoverClass); }); }); })(jQuery); \ No newline at end of file From eb90ffa2b2a500fb42b1b3ca954fed60bb73d252 Mon Sep 17 00:00:00 2001 From: Akkuma Date: Wed, 26 Jan 2011 11:03:26 -0500 Subject: [PATCH 5/9] Added a label class and moved function invocation to be inside. --- js/jquery.ezmark.js | 17 ++++++++++------- 1 file changed, 10 insertions(+), 7 deletions(-) diff --git a/js/jquery.ezmark.js b/js/jquery.ezmark.js index a10a683..6f7dd57 100644 --- a/js/jquery.ezmark.js +++ b/js/jquery.ezmark.js @@ -16,10 +16,12 @@ * $('selector').ezMark([options]); * * [options] accepts following JSON properties: - * checkboxClass - custom checkbox class - * checkedClass - checked state's class - * radioClass - custom radiobutton class - * + * checkboxClass - class applied to wrapping container (div) of a checkbox input + * checkedClass - class applied to wrapping container when the input is checked + * radioClass - class applied to the wrapping container (div) of a radio input + * hideClass - class applied to the input + * hoverClass - class applied while hovering over the label or div + * labelClass - class applied to associated label for custom input * * * View Documention/Demo here: @@ -40,7 +42,8 @@ radioClass: NAMESPACE + '-radio', checkedClass: NAMESPACE + '-checked', hideClass: NAMESPACE + '-hide', - hoverClass: NAMESPACE + '-hover' + hoverClass: NAMESPACE + '-hover', + labelClass: NAMESPACE + '-label' }; $.extend(defaults, options) @@ -55,7 +58,7 @@ $this.addClass(defaults.hideClass + ' ' + DELEGATE_CLASS).wrap('
'); var $parent = $this.parent(); this.checked && $parent.addClass(defaults.checkedClass); - $('label[for=' + this.id + ']').addClass(DELEGATE_CLASS); + $('label[for=' + this.id + ']').addClass(defaults.labelClass + ' ' + DELEGATE_CLASS); $.data( $parent[0], NAMESPACE, @@ -92,4 +95,4 @@ $divWrapper.toggleClass($.data($divWrapper[0], NAMESPACE).classNames.hoverClass); }); }); -})(jQuery); \ No newline at end of file +}(jQuery)); \ No newline at end of file From 024902e3675644ef0b07f5e00f5f368c1dab7c0e Mon Sep 17 00:00:00 2001 From: Akkuma Date: Wed, 26 Jan 2011 11:13:33 -0500 Subject: [PATCH 6/9] Modified CSS to take into account new default classes --- css/ezmark.css | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/css/ezmark.css b/css/ezmark.css index 8a74a43..48e5ead 100644 --- a/css/ezmark.css +++ b/css/ezmark.css @@ -2,24 +2,24 @@ * CSS File for ezMark jQuery Plugin * **/ -.ez-hide { opacity: 0; filter:alpha(opacity=0); } -.ez-checkbox { +.ezmark-hide { opacity: 0; filter:alpha(opacity=0); } +.ezmark-checkbox { background: transparent url('../images/checkbox-red.png') 0 1px no-repeat; display:inline-block; } -.ez-radio { +.ezmark-radio { background: transparent url('../images/radio-black.png') 0 1px no-repeat; display:inline-block; } -.ez-checked { background-position: 0 -18px; } -.ez-selected { background-position: 0 -19px; } +.ezmark-checked { background-position: 0 -18px; } +.ezmark-selected { background-position: 0 -19px; } -.ez-checkbox-green { +.ezmark-checkbox-green { background: transparent url('../images/checkbox-green.png') 0 1px no-repeat; display:inline-block; *display: inline; } -.ez-checked-green { background-position: 0 -18px; } -.ez-checkbox, .ez-radio { zoom: 1; *display:inline; _height:30px; } +.ezmark-checked-green { background-position: 0 -18px; } +.ezmark-checkbox, .ezmark-radio { zoom: 1; *display:inline; _height:30px; } From 2c9605875c57461c58e5ed720b32de301cef79b9 Mon Sep 17 00:00:00 2001 From: Akkuma Date: Fri, 11 Feb 2011 10:40:12 -0500 Subject: [PATCH 7/9] JSLinted, support for multiple class names, added an additional label class to identify whether the label is for a radio or checkbox --- js/jquery.ezmark.js | 101 ++++++++++++++++++++++++++------------------ 1 file changed, 61 insertions(+), 40 deletions(-) diff --git a/js/jquery.ezmark.js b/js/jquery.ezmark.js index 6f7dd57..d516785 100644 --- a/js/jquery.ezmark.js +++ b/js/jquery.ezmark.js @@ -1,36 +1,36 @@ /** - * ezMark - A Simple Checkbox and Radio button Styling plugin. - * This plugin allows you to use a custom Image for Checkbox or Radio button. Its very simple, small and easy to use. - * - * Copyright (c) Abdullah Rubiyath . - * Released under MIT License - * - * Files with this plugin: - * - jquery.ezmark.js - * - ezmark.css - * - * - * At first, include both the css and js file at the top - * - * Then, simply use: - * $('selector').ezMark([options]); - * - * [options] accepts following JSON properties: - * checkboxClass - class applied to wrapping container (div) of a checkbox input - * checkedClass - class applied to wrapping container when the input is checked - * radioClass - class applied to the wrapping container (div) of a radio input - * hideClass - class applied to the input - * hoverClass - class applied while hovering over the label or div - * labelClass - class applied to associated label for custom input - * - * - * View Documention/Demo here: - * http://www.itsalif.info/content/ezmark-jquery-checkbox-radiobutton-plugin - * - * @author Abdullah Rubiyath, Gregory Waxman - * @version 2.0 - * @date January 25, 2011 - */ +* ezMark - A Simple Checkbox and Radio button Styling plugin. +* This plugin allows you to use a custom Image for Checkbox or Radio button. Its very simple, small and easy to use. +* +* Copyright (c) Abdullah Rubiyath . +* Released under MIT License +* +* Files with this plugin: +* - jquery.ezmark.js +* - ezmark.css +* +* +* At first, include both the css and js file at the top +* +* Then, simply use: +* $('selector').ezMark([options]); +* +* [options] accepts following JSON properties: +* checkboxClass - class applied to wrapping container (div) of a checkbox input +* checkedClass - class applied to wrapping container when the input is checked +* radioClass - class applied to the wrapping container (div) of a radio input +* hideClass - class applied to the input +* hoverClass - class applied while hovering over the label or div +* labelClass - class applied to associated label for custom input +* +* +* View Documention/Demo here: +* http://www.itsalif.info/content/ezmark-jquery-checkbox-radiobutton-plugin +* +* @author Abdullah Rubiyath, Gregory Waxman +* @version 2.0 +* @date January 25, 2011 +*/ (function ($) { var NAMESPACE = 'ezmark'; @@ -43,22 +43,41 @@ checkedClass: NAMESPACE + '-checked', hideClass: NAMESPACE + '-hide', hoverClass: NAMESPACE + '-hover', - labelClass: NAMESPACE + '-label' + labelClass: NAMESPACE + '-label', + labelCheckboxClass: NAMESPACE + '-label-checkbox', + labelRadioClass: NAMESPACE + '-label-radio' }; - $.extend(defaults, options) + $.extend(defaults, options); return this.each(function () { var type = this.type; if ((type === 'radio' || type === 'checkbox') && !$.data(this, NAMESPACE)) { var $this = $(this); - var className = type === 'checkbox' ? defaults.checkboxClass : defaults.radioClass; + var classNames; - $this.addClass(defaults.hideClass + ' ' + DELEGATE_CLASS).wrap('
'); + if (type === 'checkbox') { + classNames = { + input: defaults.checkboxClass, + label: defaults.labelCheckboxClass + }; + } + else { + classNames = { + input: defaults.radioClass, + label: defaults.labelRadioClass + }; + } + + $this.addClass(defaults.hideClass + ' ' + DELEGATE_CLASS).wrap('
'); var $parent = $this.parent(); - this.checked && $parent.addClass(defaults.checkedClass); - $('label[for=' + this.id + ']').addClass(defaults.labelClass + ' ' + DELEGATE_CLASS); + + if (this.checked) { + $parent.addClass(defaults.checkedClass); + } + + $('label[for=' + this.id + ']').addClass(defaults.labelClass + ' ' + DELEGATE_CLASS + ' ' + classNames.label); $.data( $parent[0], NAMESPACE, @@ -71,7 +90,7 @@ ); } }); - } + }; $(function () { $(document.body).delegate('input.' + DELEGATE_CLASS, 'change', function () { @@ -86,7 +105,9 @@ } else if (type === 'radio') { $('input[name="' + this.name + '"]').parent().removeClass(className); - this.checked && $parent.addClass(className); + if (this.checked) { + $parent.addClass(className); + } } }).delegate('div.' + DELEGATE_CLASS, 'hover', function () { $(this).toggleClass($.data(this, NAMESPACE).classNames.hoverClass); From a44278462d6b8a321c759f2815d03942b9170bd7 Mon Sep 17 00:00:00 2001 From: Akkuma Date: Mon, 14 Feb 2011 10:08:12 -0500 Subject: [PATCH 8/9] Fixed data check as to prevent multiple "instantiations" of the plugin on the same input --- js/jquery.ezmark.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/jquery.ezmark.js b/js/jquery.ezmark.js index d516785..cdc4a16 100644 --- a/js/jquery.ezmark.js +++ b/js/jquery.ezmark.js @@ -53,7 +53,7 @@ return this.each(function () { var type = this.type; - if ((type === 'radio' || type === 'checkbox') && !$.data(this, NAMESPACE)) { + if ((type === 'radio' || type === 'checkbox') && !$.data(this.parentNode, NAMESPACE)) { var $this = $(this); var classNames; From 92ae7e52fb2de7fa2b631d4d479efa0339f718c4 Mon Sep 17 00:00:00 2001 From: Akkuma Date: Mon, 28 Feb 2011 10:55:04 -0500 Subject: [PATCH 9/9] Switched from using the change event to the click event. IE was not properly handling the change event being fired through a programmatic input.click Added a disabled class for additional styling control of both the label and input. Moved default options outside of function to prevent creating the same defaults over and over. --- js/jquery.ezmark.js | 37 ++++++++++++++++++++++--------------- 1 file changed, 22 insertions(+), 15 deletions(-) diff --git a/js/jquery.ezmark.js b/js/jquery.ezmark.js index cdc4a16..d24d54d 100644 --- a/js/jquery.ezmark.js +++ b/js/jquery.ezmark.js @@ -22,6 +22,7 @@ * hideClass - class applied to the input * hoverClass - class applied while hovering over the label or div * labelClass - class applied to associated label for custom input +* disabledClass - class applied to wrapping container (div) and associated label when input is disabled * * * View Documention/Demo here: @@ -35,20 +36,20 @@ (function ($) { var NAMESPACE = 'ezmark'; var DELEGATE_CLASS = NAMESPACE + '-del'; + var defaultOptions = { + checkboxClass: NAMESPACE + '-checkbox', + radioClass: NAMESPACE + '-radio', + checkedClass: NAMESPACE + '-checked', + hideClass: NAMESPACE + '-hide', + hoverClass: NAMESPACE + '-hover', + labelClass: NAMESPACE + '-label', + labelCheckboxClass: NAMESPACE + '-label-checkbox', + labelRadioClass: NAMESPACE + '-label-radio', + disabledClass: NAMESPACE + '-disabled' + }; $.fn.ezMark = function (options) { - var defaults = { - checkboxClass: NAMESPACE + '-checkbox', - radioClass: NAMESPACE + '-radio', - checkedClass: NAMESPACE + '-checked', - hideClass: NAMESPACE + '-hide', - hoverClass: NAMESPACE + '-hover', - labelClass: NAMESPACE + '-label', - labelCheckboxClass: NAMESPACE + '-label-checkbox', - labelRadioClass: NAMESPACE + '-label-radio' - }; - - $.extend(defaults, options); + var defaults = $.extend({}, defaultOptions, options); return this.each(function () { var type = this.type; @@ -56,6 +57,7 @@ if ((type === 'radio' || type === 'checkbox') && !$.data(this.parentNode, NAMESPACE)) { var $this = $(this); var classNames; + var isDisabled = !!this.disabled; if (type === 'checkbox') { classNames = { @@ -70,14 +72,19 @@ }; } - $this.addClass(defaults.hideClass + ' ' + DELEGATE_CLASS).wrap('
'); + classNames.disabled = defaults.disabledClass; + + $this.addClass(defaults.hideClass + ' ' + DELEGATE_CLASS) + .wrap('
'); var $parent = $this.parent(); if (this.checked) { $parent.addClass(defaults.checkedClass); } - $('label[for=' + this.id + ']').addClass(defaults.labelClass + ' ' + DELEGATE_CLASS + ' ' + classNames.label); + $('label[for=' + this.id + ']').addClass(defaults.labelClass + ' ' + DELEGATE_CLASS + ' ' + classNames.label + (isDisabled ? ' ' + classNames.disabled : '')); $.data( $parent[0], NAMESPACE, @@ -93,7 +100,7 @@ }; $(function () { - $(document.body).delegate('input.' + DELEGATE_CLASS, 'change', function () { + $(document.body).delegate('input.' + DELEGATE_CLASS, 'click', function ($e) { var $this = $(this); var type = this.type; var $parent = $this.parent();