页面重新加载问题

当页面第一次加载下面提到的日历控件不起作用时。但是当我重新加载页面时，它正常工作。我可以解决这个奇怪的问题吗？

带有js代码的.aspx文件

$(document).ready(function () { var initMethod = function () { multiDatesPickerBinding(); }; initMethod(); //when page loads for first time var multiDatesPickerBinding = function () { $('.button-set').buttonset(); $(".datePicker").each(function () { var target = $(this); target.datepicker({ showAnim: '', changeMonth: true, minDate: target.data('min'), changeYear: true, dateFormat: 'm/d/yy', yearRange: 'c-20:c+10' }); }); $('.enumeration').buttonset(); $.datepicker._getDate = function (inst) { var startDate = (!inst.currentYear || (inst.input && inst.input.value == '') ? null : this._daylightSavingAdjust(new Date( inst.currentYear, inst.currentMonth, inst.currentDay))); return startDate; }; $.datepicker._defaults.dateFormat = 'yy-mm-dd'; $.valHooks['multiDatesPicker'] = { get: function (elem) { return $(elem).multiDatesPicker('getDates'); } }; //, set: function (elem, v) { $(elem).multiDatesPicker('addDates', v); } }; $.valHooks['datepicker'] = { get: function (elem) { return $(elem).datepicker('getDate'); } }; //, set: function (elem, v) { $(elem).datepicker('setDate', v); } }; window.checkForCalendars = function () { $('.inline-calendar,.inline-multi-calendar').each(function () { var self = $(this); var type = 'datepicker'; var format = 'yy-mm-dd'; var target = self.data('target'); var value = self.data('value'); var args = { dateFormat: format, onSelect: function () { whenSelectDateFromCalendar(self); } }; args['numberOfMonths'] = self.data('months') || 1; args['minDate'] = self.data('min'); args['maxDate'] = self.data('max'); if (self.data('multi')) { type = 'multiDatesPicker'; value = value ? value.split(',') : null; } if (target) { var rawValue = $('#' + target).val(); if (rawValue) value = $.datepicker.parseDate(format, rawValue); args.altField = '#' + target; args.altFormat = format; } self[type](args); self.data('val.type', type); if (type == "multiDatesPicker") { if (value) { self.multiDatesPicker('addDates', value); } var disallowed = self.data('disallowed'); if (disallowed) { self.multiDatesPicker('addDates', disallowed.split(','), 'avoided'); } } else { self.datepicker('setDate', value); var allowedRaw = self.data('allowed'); if (allowedRaw !== undefined) { var allowed = allowedRaw.split(','); $('.inline-calendar').datepicker('option', 'beforeShowDay', function (date) { var format = $.datepicker.formatDate('yy-mm-dd', date); return [$.inArray(format, allowed) >= 0 ? true : false, '']; }); } } }); }; window.checkForCalendars(); }; //for when select a date from calendar var whenSelectDateFromCalendar = function (self) { var isBordingDateFromDropOffCalendar = $(self).hasClass('begin-date'); if (!isBordingDateFromDropOffCalendar) { ShowLoader(); hideErrors(); $('.bookingerror').empty(); var keys = initKeyValues(); if (keys.selectedDates.length == 0) { $("#error-dates").show(); return false; } $('#available-times').load('/PetBooking/GetAvailableTimesForServiceAndDates/', { 'providerKey': '', 'ownerKey': '', 'serviceId': $('#ddlService').val(), 'petKeys': keys.petKeys, 'selectedDates': keys.selectedDates, 'employeeKey': keys.employeeKey }, function (response, status, xhr) { if (status == "error") { exceptionForDates(xhr); } else { $("#error-dates").hide(); timePickerBinding(); } HideLoader(); }); } }; }); 

Answer 1

将您的函数定义multiDatesPickerBinding DOM ready函数之外，你可能没问题。 告诉你加载页面时会发生什么（ctrl + f5）…在加载时，浏览器将函数定义存储在DOM树或内存中。 完成后，它将按顺序开始执行。

在你的情况下，它绑定负载：

• $
• 准备好了

它真的应该这样做：

• $
• multiDatesPickerBinding
• 准备好了