页面重新加载问题

本文介绍了页面重新加载问题的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

下面第一次第一次加载页面时，提到的日历控制无法正常工作，但是当我重新加载页面时，它可以正常工作.我有什么技巧可以解决这个奇怪的问题吗?

When page loads for the first time below mentioned calender control is not working.But when I reload the page, it's working properly.Can I have any trick for solve this weird issue ?

.js带有js代码的文件

$(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': '<%:Model.Provider.Key%>', 'ownerKey': '<%:Model.Owner.Key%>', '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(); }); } }; });

推荐答案

将函数定义multiDatesPickerBinding移到DOM ready函数之外，可能还不错.告诉您加载页面(ctrl + f5)时会发生什么...加载时，浏览器将函数定义存储在DOM树或内存中.完成后，它将开始按顺序执行.

Move your function definition multiDatesPickerBinding outside the DOM ready function and you're probably fine. To tell you what happens when you load the page (ctrl+f5) ... At loading the browser stores the function definitions in the DOM tree or memory. Once that is done it starts executing in order.

在您的情况下，它会在加载时绑定:

In your case it binds on load:

• $
• 准备就绪

实际上应该这样做的原因:

Whyle it should actually do:

• $
• multiDatesPickerBinding
• 准备就绪