diff options
author | adambaratz <adam.baratz@gmail.com> | 2011-04-15 07:23:46 -0700 |
---|---|---|
committer | Scott González <scott.gonzalez@gmail.com> | 2011-05-02 09:53:13 -0400 |
commit | 74d195e39681791545b3026a66bfa3f319237e5a (patch) | |
tree | 1b99470f3c8203f0e78fdbe0307da25ea8913c39 /ui/jquery.ui.datepicker.js | |
parent | 94b7e6bf18a0b47531026a558cb88aa932661ca6 (diff) | |
download | jquery-ui-74d195e39681791545b3026a66bfa3f319237e5a.tar.gz jquery-ui-74d195e39681791545b3026a66bfa3f319237e5a.zip |
Datepicker: bind hover events using delegate. Fixed #7256 - minimize event binding in Datepicker initialization.
Diffstat (limited to 'ui/jquery.ui.datepicker.js')
-rw-r--r-- | ui/jquery.ui.datepicker.js | 47 |
1 files changed, 27 insertions, 20 deletions
diff --git a/ui/jquery.ui.datepicker.js b/ui/jquery.ui.datepicker.js index cc27365d3..3437d0bda 100644 --- a/ui/jquery.ui.datepicker.js +++ b/ui/jquery.ui.datepicker.js @@ -16,6 +16,7 @@ $.extend($.ui, { datepicker: { version: "@VERSION" } }); var PROP_NAME = 'datepicker'; var dpuuid = new Date().getTime(); +var instActive; /* Date picker manager. Use the singleton instance of this class, $.datepicker, to interact with the date picker. @@ -107,7 +108,7 @@ function Datepicker() { autoSize: false // True to size the input for the date format, false to leave as is }; $.extend(this._defaults, this.regional['']); - this.dpDiv = $('<div id="' + this._mainDivId + '" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"></div>'); + this.dpDiv = bindHover($('<div id="' + this._mainDivId + '" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"></div>')); } $.extend(Datepicker.prototype, { @@ -173,7 +174,7 @@ $.extend(Datepicker.prototype, { drawMonth: 0, drawYear: 0, // month being drawn inline: inline, // is datepicker inline or not dpDiv: (!inline ? this.dpDiv : // presentation div - $('<div class="' + this._inlineClass + ' ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"></div>'))}; + bindHover($('<div class="' + this._inlineClass + ' ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"></div>')))}; }, /* Attach the date picker to an input field. */ @@ -674,29 +675,13 @@ $.extend(Datepicker.prototype, { _updateDatepicker: function(inst) { var self = this; var borders = $.datepicker._getBorders(inst.dpDiv); + instActive = inst; // for delegate hover events inst.dpDiv.empty().append(this._generateHTML(inst)); var cover = inst.dpDiv.find('iframe.ui-datepicker-cover'); // IE6- only if( !!cover.length ){ //avoid call to outerXXXX() when not in IE6 cover.css({left: -borders[0], top: -borders[1], width: inst.dpDiv.outerWidth(), height: inst.dpDiv.outerHeight()}) } - inst.dpDiv.find('button, .ui-datepicker-prev, .ui-datepicker-next, .ui-datepicker-calendar td a') - .bind('mouseout', function(){ - $(this).removeClass('ui-state-hover'); - if(this.className.indexOf('ui-datepicker-prev') != -1) $(this).removeClass('ui-datepicker-prev-hover'); - if(this.className.indexOf('ui-datepicker-next') != -1) $(this).removeClass('ui-datepicker-next-hover'); - }) - .bind('mouseover', function(){ - if (!self._isDisabledDatepicker( inst.inline ? inst.dpDiv.parent()[0] : inst.input[0])) { - $(this).parents('.ui-datepicker-calendar').find('a').removeClass('ui-state-hover'); - $(this).addClass('ui-state-hover'); - if(this.className.indexOf('ui-datepicker-prev') != -1) $(this).addClass('ui-datepicker-prev-hover'); - if(this.className.indexOf('ui-datepicker-next') != -1) $(this).addClass('ui-datepicker-next-hover'); - } - }) - .end() - .find('.' + this._dayOverClass + ' a') - .trigger('mouseover') - .end(); + inst.dpDiv.find('.' + this._dayOverClass + ' a').mouseover(); var numMonths = this._getNumberOfMonths(inst); var cols = numMonths[1]; var width = 17; @@ -1719,6 +1704,28 @@ $.extend(Datepicker.prototype, { } }); +/* + * Bind hover events for datepicker elements. + * Done via delegate so the binding only occurs once in the lifetime of the parent div. + * Global instActive, set by _updateDatepicker allows the handlers to find their way back to the active picker. + */ +function bindHover(dpDiv) { + var selector = 'button, .ui-datepicker-prev, .ui-datepicker-next, .ui-datepicker-calendar td a'; + return dpDiv.delegate(selector, 'mouseout', function() { + $(this).removeClass('ui-state-hover'); + if (this.className.indexOf('ui-datepicker-prev') != -1) $(this).removeClass('ui-datepicker-prev-hover'); + if (this.className.indexOf('ui-datepicker-next') != -1) $(this).removeClass('ui-datepicker-next-hover'); + }) + .delegate(selector, 'mouseover', function(){ + if (!$.datepicker._isDisabledDatepicker( instActive.inline ? dpDiv.parent()[0] : instActive.input[0])) { + $(this).parents('.ui-datepicker-calendar').find('a').removeClass('ui-state-hover'); + $(this).addClass('ui-state-hover'); + if (this.className.indexOf('ui-datepicker-prev') != -1) $(this).addClass('ui-datepicker-prev-hover'); + if (this.className.indexOf('ui-datepicker-next') != -1) $(this).addClass('ui-datepicker-next-hover'); + } + }); +} + /* jQuery extend now ignores nulls! */ function extendRemove(target, props) { $.extend(target, props); |