DatePicker 显示速度很慢答案

【问题标题】：DatePicker show speed very slowDatePicker 显示速度很慢
【发布时间】：2011-07-08 06:24:01
【问题描述】：

我在我的项目中使用 jquery datepicker。我正在使用 ajax 访问数据库以检索需要在每个月份更改时突出显示的日期。这是使用 onChangeMonthYear: function(year, month, inst) 和 beforeShowDay: function(dateToShow) 事件完成的。日期被适当地突出显示，但我遇到的问题是，在演出前活动中突出显示日期确实需要很长时间。我想在这里指出，我本地机器上的访问时间非常快，并且消除了服务器响应时间导致突出显示延迟的事实。

我也尝试过使用 duration: 'fast'，但这也无济于事。

1.如何增加日期的显示时间？或

2.如何无法使用日历，这样在显示日期之前，用户无法浏览其他月份。

【问题讨论】：

在您的代码上设置一些时间，找出瓶颈所在，然后将您的代码连同您的问题一起发布。
有没有办法禁用日期选择器或至少月份选择器直到 beforeshowday 还没有完成？
嗨 user281180 .. 你检查我的答案了吗？我相信它应该可以工作。

标签： jquery jquery-ui

【解决方案1】：

您应该能够通过使用其disable 选项来禁用/启用日期选择器：

$('.selector').datepicker({
    onChangeMonthYear: function(year, month, inst) {
        $(this).datepicker( "option", "disabled", true);
    },

    beforeShowDay: function(date) {
        $(this).datepicker( "option", "disabled", false);
    }
});

【讨论】：

【解决方案2】：

我想质疑你在这方面的方法，但我可能错了，因为我们没有所有的事实。但从我们得到的结果来看：

方法 1. 在没有任何 ajax 的情况下加载所有日期服务器端，因为最好只加载多一点数据而不是加载多次。

方法2。如果1不可能用ajax加载所有日期，然后在ajax回调中激活日期选择器。

方法 3。如果有大量日期，您可以批量处理，至少确保您有几个月的时间。

【讨论】：

【解决方案3】：

没有代码有点困难，但试试以下：

在 CSS 文件中：#calendarContainer {display:none;}

$(function(){$('#calendarContainer').show();}); 
//Will only show when document is ready.

或者，如果页面已经加载，日期延迟发生：

在 CSS 文件中：#calendarContainer {display:none;}

$(function(){

var sI = setInterval(function() {
    if ($('.dateHighlightContainer .dates').hasClass('highlight'))
    { 
        $('#calendarContainer').show();
        clearInterval(sI);
    }
}, 1000); 
    }); 
//Check each second - Will stop and display calendar once it finds the class highlight

查看我的完整示例以获取更多详细信息：http://jsfiddle.net/Jeu5q/

【讨论】：

【解决方案4】：

你的延迟问题一定和你的ajax方法有关。这是工作的example。我没有注意到预定义日期有任何延迟问题。

// Highlighted Days
var dayList = [1, 3, 5, 7, 9, 11 , 13 , 15 , 17 , 19 , 21 , 23 , 25 , 27 ];
var monthList = ["Jan", "Feb" , "Mar" , "Apr" , "May" , "Jun" , "Jul" , "Aug" , "Sep" , "Oct" , "Nov","Dec"  ];

function createDays(dayList, month, year) {

    var dateArray = new Array();
    $.each(dayList, function(i, value) {
        dateArray.push(new Date(month.concat(' ', value, ', ', year)));
    });
    return dateArray;
}

$(document).ready(function() {

    $dateArray = createDays(dayList, "Jul", "2011");

    $('#datepicker').datepicker({
        beforeShowDay: function(_date) {

            $highLightDay = false;            
            $.each($dateArray , function(i, date) {
                if (date.valueOf() == _date.valueOf()) {                   
                  $highLightDay = true;
                }                 
            });

            if($highLightDay)
                return [true, "ui-state-active" ,"Event-".concat(_date)];

            return [true, "", ""];
        },
        onChangeMonthYear: function(year, month, inst) {
           $dateArray = createDays(dayList, monthList[month-1], year);     

        }

    });

});

【讨论】：

"路飞，非常感谢。确实问题出在 ajaz 请求上，它在服务器端需要更多时间。感谢所有试图帮助我的人。所有的例子和解释确实很有帮助。

【解决方案5】：

如果您的 calendar/classes/tc_calendar.php 第 9 行显示...

$WEB_SUPPORT = "http://www.triconsole.com/php/calendar_datepicker.php";

延迟是超时，所以需要将第18行改为...

public $check_new_version = false;

日期选择器恢复正常。

【讨论】：