即使在刷新后也记住在 datepicker 中选择的日期答案

【问题标题】：Remember the date selected in datepicker even after refresh即使在刷新后也记住在 datepicker 中选择的日期
【发布时间】：2013-07-08 03:33:04
【问题描述】：

我只想知道我的日期选择器是否能记住选择的月份。例如，我选择 2013 年 6 月 1 日，即使刷新后日期选择器中显示的月份仍然是 6 月。

这是我的代码。

$(function() {
    
    var startDate;
    var endDate;
    var selectCurrentWeek = function() {
        window.setTimeout(function () {
            $('#weekpicker').datepicker('widget').find('.ui-datepicker-current-day a').addClass('ui-state-active')
        }, 1);
    }
    
    $('#weekpicker').datepicker( {
        
        changeYear:true,
        changeMonth:true,
        showButtonPanel:true,
        
        onSelect: function(dateText, inst) {
            
            var date = $(this).datepicker('getDate');
            startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 1);
            endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 7);
            var dateFormat = inst.settings.dateFormat || $.datepicker._defaults.dateFormat;
            $('#weekpicker').val($.datepicker.formatDate( dateFormat, startDate, inst.settings )
                 + ' - ' + $.datepicker.formatDate( dateFormat, endDate, inst.settings ));
            
         selectCurrentWeek();   
     
        },
        
        beforeShow: function() {
            selectCurrentWeek();
        },
        
        beforeShowDay: function(date) {
            var cssClass = '';
            if(date >= startDate && date <= endDate)
                cssClass = 'ui-datepicker-current-day';
            return [true, cssClass];
        },
        
        onChangeMonthYear: function(year, month, inst) {
            selectCurrentWeek(); 
        }
    
    }).datepicker('widget').addClass('ui-weekpicker');
    
    $('.ui-weekpicker .ui-datepicker-calendar tr').live('mousemove', function() { $(this).find('td a').addClass('ui-state-hover'); });
    $('.ui-weekpicker .ui-datepicker-calendar tr').live('mouseleave', function() { $(this).find('td a').removeClass('ui-state-hover'); });

    
});

【问题讨论】：

没有什么神奇的方法，你必须将它存储在某个地方（cookie，本地存储，db，window.name...）并在页面加载时恢复值
我建议您将所选日期放入可在服务器端检索的备用字段altfield：$('#weekpicker').datepicker({ altField: "#actualDate" });

标签： php javascript jquery codeigniter

【解决方案1】：

您需要处理会话。

网站刷新后，只需将日期添加到PHP session。您可以阅读有关 sessionn 的更多信息 here 以及您正在寻找的更具体的示例 here。

【讨论】：

这是众多解决方案之一，这对 SO 来说不是一个好问题的原因之一

【解决方案2】：

好吧，您在 if 语句中的 "" 中添加了一个空格。而且我想无论如何我的逻辑都不好-您可能应该使用“&&”而不是“||”。所以请按原样使用以下代码：

$('input[type=text][id*=myDate1]').datepicker({
                showOn: "button",
                buttonImage: "/Images/cal.gif",
                buttonImageOnly: true,
                onSelect: function (dateText, inst) {    $('#HiddenField1').val(dateText) },
                changeMonth: true,
                changeYear: true,
                showWeek: true,
                firstDay: 1

            });
            var theDate;

            if ($('#HiddenField1').val() != "" && $('#HiddenField1').val() != null) {
                theDate = $('#HiddenField1').val();
            }
            else {
                theDate = new Date();
            }
            alert(theDate);
            $('input[type=text][id*=myDate1]').datepicker("option", "showAnim", 'bounce');
            $('input[type=text][id*=myDate1]').datepicker("option", "dateFormat", 'dd/mm/yy');
            $('input[type=text][id*=myDate1]').datepicker("option", "altFormat", 'dd/mm/yy');
            $('input[type=text][id*=myDate1]').datepicker('setDate', theDate);

【讨论】：