0

我有一个曾经运行良好的 jQuery 日期选择器。但是,从昨天开始,我一定改变了一些东西。当我将鼠标悬停在日历上时,什么也没有发生。当我单击日历时,没有任何效果。但是,我可以通过代码更改日历的行为。如您所见,我能够删除第一个日历中的上一个和下一个按钮。有什么我忘了检查吗?为什么我不能再选择日历的任何日期?任何提示表示赞赏。顺便说一句,我检查了 JSFiddle 上的代码,它在那里工作:(

这是我的JavaScript

$(function() {
    var startDate;
    var endDate;

var selectCurrentWeek = function() {

    window.setTimeout(function () {
          $('#datepicker').find('.ui-datepicker-current-day tr').addClass('ui-state-hover');
          $('#datepicker').find('.ui-datepicker-next').remove();
          $('#datepicker').find('.ui-datepicker-prev').remove();
    }, 1);
}

$('#datepicker').datepicker( {
    showOtherMonths: true,
    selectOtherMonths: false,
    onSelect: function(dateText, inst) {
        var date = $(this).datepicker('getDate');
        startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay());
        endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6);
        $('#calendar').weekCalendar('gotoWeek', date);
        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' ).datepicker( "option", $.datepicker.regional[ 'de' ] );
$('#datepicker').find('.ui-datepicker-next').remove();
$('#datepicker').find('.ui-datepicker-prev').remove();
$('#datepicker .ui-datepicker-calendar tr').live('mousemove', function() { $(this).find('td a').addClass('ui-state-hover'); });
$('#datepicker .ui-datepicker-calendar tr').live('mouseleave', function() { $(this).find('td a').removeClass('ui-state-hover'); });


    // handling datepicker classes
    var startDate;
    var endDate;

    var selectCurrentWeek_next = function() {

        window.setTimeout(function () {
        }, 1);
    }

    $('#datepicker_next_month').datepicker( {
        showOtherMonths: true,
        selectOtherMonths: true,
        onSelect: function(dateText, inst) {
            var date = $(this).datepicker('getDate');
            $('#calendar').weekCalendar('gotoWeek', date);
            selectCurrentWeek_next();
        },
        beforeShowDay: function(date) {
            var cssClass = '';
            return [true, cssClass];
        },
        onChangeMonthYear: function(year, month, inst) {
            selectCurrentWeek_next();
        }
    });

    $('#datepicker_next_month' ).datepicker( "option", $.datepicker.regional[ 'de' ] );
    $('#datepicker_next_month' ).datepicker().datepicker('setDate','+1m');
    $('#datepicker_next_month .ui-datepicker-calendar tr').live('mousemove', function() { $(this).find('td a').addClass('ui-state-hover'); });
    $('#datepicker_next_month .ui-datepicker-calendar tr').live('mouseleave', function() { $(this).find('td a').removeClass('ui-state-hover'); });
});

这是相关的HTML部分:

<div id="datepicker"></div>
<div id="datepicker_next_month"></div>

这些是我导入的脚本:

  <script type='text/javascript' src='libs/jquery-1.4.4.min.js'></script>
  <script type='text/javascript' src='libs/jquery-ui-1.8.11.custom.min.js'></script>
  <script type='text/javascript' src='libs/jquery-ui-i18n.js'></script>

这是日历的图像:

在此处输入图像描述

4

1 回答 1

0

我终于找到了问题所在。我使用了 Google Chroms Element 检查器,发现另一个 div 覆盖了 datepicker div。解决该问题后,一切都恢复正常:)

于 2013-04-21T11:17:44.067 回答